QWebEngineView使用-Qt与Js相互调用

Qt开发老杰

墨衍会员 · AI 创作全网分发码龄4年

关注

VIP免费原创最新推荐文章于 2024-04-13 21:49:28 发布 1.7k 阅读 AI 写同款· GEO 优化 ›

Ubuntu Qt QWebEngine使用、Js交互 1.QwebEngineView加载本地html 2.qt与js交互。阅读详情

QWebengineView使用说明

1. 工程文件

QT += webenginewidgets

2. 源代码

#include <QWebEngineView>

QWebEngineView* view;

    view = new QWebEngineView(this);
    view->load(QUrl("http://www.baidu.com/"));
    view->show();

使用Js调用Qt中类的原理，是在Qt中新建一个C++的类作为C++与Js的共同的类，这个类的父类是QObject，通过webChannel将这个类注册到Js中后，然后，将qtwebengineview的通道设置为webChannel，Js可以直接调用桥梁中的糟函数，再利用糟函数发出信号，再使用其它窗口接收这个类的信号，完成Js调用Qt中函数的作用。

详解

使用原理

使用Js调用Qt中类的原理，是在Qt中新建一个C++的类作为C++与Js的共同的类，这个类的父类是QObject，通过webChannel将这个类注册到Js中后，然后，将qtwebengineview的通道设置为webChannel，Js可以直接调用桥梁中的糟函数，再利用糟函数发出信号，再使用其它窗口接收这个类的信号，完成Js调用Qt中函数的作用。

代码

定义一个Qt调用Js的通道

文件名: webBridge.h
*****************************
class JsChannel : public QObject
{    
    Q_OBJECT
public:    
    explicit JsChannel(QObject *parent = nullptr);
public slots:
    //这个糟函数是给Js调用的，每当Js调用这个 jsCallme() 这个类就会在Qt中产生