QWebEngineView使用-Qt與Js相互調用


QWebengineView使用說明

使用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函數>)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM