QT基于QWebEngineView实现页面开发


QT基于QWebEngineView实现页面开发

QtWebkits在Qt5.6以上版本被QWebEngineView淘汰了,QWebEngineView是利用槽通信实现QT窗口与页面进行通信。下面我要分享的就是QWebEngineView如何实现交互。

加载页面并注入对象

QWebEngineView *m_view = new QWebEngineView(this);
QWebChannel *m_channel = new QWebChannel(this);

m_channel->registerObject("WebViewObj", this);//WebViewObj对象用于页面访问后台方法
m_view->page()->setWebChannel(m_channel);

m_view->page()->load(QUrl("https://passport.csdn.net/passport_fe/login.html"));//调用CSDN页面

m_view->page()->runJavaScript(QString("new QWebChannel(qt.webChannelTransport, function(channel){window.WebViewObj = channel.objects.WebViewObj;});"));//这步很重要,转换对象为页面对象,当然也可以写在js脚本里面

示例如下:

QT执行js方法

重点:js要引用 “qwebchannel.js”文件
js代码如下:

function btnclick()
{
    if (window.WebViewObj) {test
            window.WebViewObj.test("测试");
        }
}

QT方法要声明在slots下,代码如下:

#include <qobject.h>
#include <qdialog.h>
#include <QWebEngineView>
#include <QWebChannel>

class TestDemo :public QWidget{
      Q_OBJECT

public slots:
    void test(QString str);
}

void TestDemo::test(QString str)
{
    qDebug()<<str;
}

输出结果:测试

QT调用JS方法

QT可以用runJavaScript直接执行js方法。此方法和你在控制台输入的效果一样:
m_View->page()->runJavaScript(“这里输入你要调用的方法”)

总结

如果你有什么不懂的可以留言给我,或者有什么好的建议我们也可以一起讨论。希望以上的分享对你的工作和学习有所帮助。
我的微信:leo_fighting2018
期待在代码的世界遇到更多同行者


评论列表 1
yangqiao

#1yangqiao

玫瑰

57天以前
leo刘

leo

  • ...
在路上~面对陌生,程序员最大的障碍在于心中的怯懦
  • 1
    文章
  • 0
    评论