使用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中產生 JsSignal這個信號
void jsCallme(){
//這個發送到Js的信號
emit JsSignal;
}
signals:
};
將Qt中的類注冊到Js中
//通過webchannel將這個類注冊到html
JsChannel myChannel = new JsChannel();
myChannel->registerObject("mybridge", myBridge);
//讓webengineview啟用 channel
ui->webEngineView->page()->setWebChannel(myChannel);
在html引入qtwebchanel
html文件
*****************************************
<script src="js/qwebchannel.js"></script>
在 Js 中注冊qt類, 並調用Qt中的方法。
new QWebChannel(qt.webChannelTransport,
function (channel) {
window.qtClass = channel.objects.mybridge; //這個mybridge與第五步中引號中的內容相同
qtClass.jsCallme('123'); //Js調用了JsCallme的函數,此時WebChannel會發送JsSignal信號。
});
Qt調用 Js 中的方法
ui->webEngineView->page()->runJavaScript(<js函數>)