介绍

一款使用PyQt5和网页端框架wangEditor集成的富文本编辑器

代码片段

PyQt5客户端

• 与网页端建立连接

  def create_connect(self):
      self.web_view = QWebEngineView()
      self.bridge = JSBridge(self.web_view.page())
      self.web_view.load(QUrl.fromLocalFile(self.editor_path))
      web_channel = QWebChannel(self.web_view.page())
      web_channel.registerObject("bridge", self.bridge)
      self.web_view.page().setWebChannel(web_channel)
  

• 执行网页端代码

  def run_js(self, func: str, *args):
      """
      执行js函数
  
      :param func: 函数名
      :param args: 函数参数
      :return:
      """
      while not self.__is_load_finished:
          QApplication.processEvents()
      self.web_page.runJavaScript(f"{func}({self.trans_args(*args)})")
  

• 执行网页端代码并获取返回值

  def get_data_from_js(self, func: str, *args):
      """
      执行js并且获取返回值
  
      :param func: 函数名
      :param args: 函数参数
      :return:
      """
      param = ["#NONE#"]
  
      def set_param(data):
          param[0] = str(data).strip()
  
      self.web_page.runJavaScript(f"{func}({self.trans_args(*args)})", set_param)
      while param[0] == "#NONE#" or not self.__is_load_finished:
          QApplication.processEvents()
      return param[0]
  

web端

• 与PyQt客户端建立连接

  new QWebChannel(qt.webChannelTransport, function (channel) {
      window.bridge = channel.objects.bridge
  })
  

效果图

WangEditor

WangEditor

源码下载

PyRichEditor

如果该文章对您有帮助请给博主点个赞哈😄