猿问

QWebEnginePage 与 javascript 交互不起作用？

我不熟悉javascriptand QWebEnginePage。

当我设置self.content.setText('text')内容时，QWebEngineView内容没有改变？


蟒蛇代码


class Document(QObject):

    textChanged = pyqtSignal(str)

    def __init__(self):

        super().__init__()

        self.text  = ''

    

    def setText(self, text):

        self.text = text

        self.textChanged.emit(text)

        print('emit')


class Demo(QWebEngineView):

    def __init__(self):

        super().__init__()

        self.content = Document()

        page = self.page()

        channel = QWebChannel()

        channel.registerObject('content', self.content)

        page.setWebChannel(channel)

        with open('index.html') as f:

            self.setHtml(f.read())


        self.content.setText('text')


app = QApplication([])

demo = Demo()

demo.resize(500, 400)

demo.show()

app.exec()

索引html：


<!doctype html>

<html>

<meta charset="utf-8">

<head>

    <script src="qwebchannel.js"></script>

</head>

<body>

<div id="placeholder">22</div>

<script>

    'use strict';


    var placeholder = document.getElementById('placeholder');


    var updateText = function (text) {

        placeholder.innerHTML = text;

        console.log(text);

    }


    new QWebChannel(qt.webChannelTransport,

        function (channel) {

            var content = channel.objects.content;

            updateText(content.text);

            content.textChanged.connect(updateText);

        }

    );

</script>

</body>

</html>


森栏
浏览 183回答 1
1回答

千万里不及你

您有以下错误：channel 是一个局部变量，一旦“Demo”构造函数完成就会被移除，它是 Python 和 Javascript 通信的中介。解决方案是通过将其传递给父类（Qt 样式）或使其成为类的属性来延长生命周期。在 .html 中，您试图包含 qwebchannel.js 但通常您应该使用<script src="qrc:///qtwebchannel/qwebchannel.js"></script>.如果您将 QObject 导出到 javascript，那么只有 Q-Properties、QSlot 和 QSignals 将被导出，因为 QWebChannel 使用 QMetaObject instropection，但“文本”都不是它们，因此它在 javascript 中将是未定义的。解决方案是将其作为 pyqtProperty 公开。import osfrom PyQt5.QtCore import pyqtProperty, pyqtSignal, QObject, QUrlfrom PyQt5.QtWidgets import QApplicationfrom PyQt5.QtWebEngineWidgets import QWebEngineViewfrom PyQt5.QtWebChannel import QWebChannelCURRENT_DIR = os.path.dirname(os.path.realpath(__file__))class Document(QObject):&nbsp; &nbsp; textChanged = pyqtSignal(str)&nbsp; &nbsp; def __init__(self):&nbsp; &nbsp; &nbsp; &nbsp; super().__init__()&nbsp; &nbsp; &nbsp; &nbsp; self._text = ""&nbsp; &nbsp; def text(self):&nbsp; &nbsp; &nbsp; &nbsp; return self._text&nbsp; &nbsp; def setText(self, text):&nbsp; &nbsp; &nbsp; &nbsp; self._text = text&nbsp; &nbsp; &nbsp; &nbsp; self.textChanged.emit(text)&nbsp; &nbsp; &nbsp; &nbsp; print("emit")&nbsp; &nbsp; text = pyqtProperty(str, fget=text, fset=setText, notify=textChanged)class Demo(QWebEngineView):&nbsp; &nbsp; def __init__(self):&nbsp; &nbsp; &nbsp; &nbsp; super().__init__()&nbsp; &nbsp; &nbsp; &nbsp; self.content = Document()&nbsp; &nbsp; &nbsp; &nbsp; channel = QWebChannel(self)&nbsp; &nbsp; &nbsp; &nbsp; channel.registerObject("content", self.content)&nbsp; &nbsp; &nbsp; &nbsp; self.page().setWebChannel(channel)&nbsp; &nbsp; &nbsp; &nbsp; filename = os.path.join(CURRENT_DIR, "index.html")&nbsp; &nbsp; &nbsp; &nbsp; self.load(QUrl.fromLocalFile(filename))&nbsp; &nbsp; &nbsp; &nbsp; self.content.setText("text")def main():&nbsp; &nbsp; app = QApplication([])&nbsp; &nbsp; demo = Demo()&nbsp; &nbsp; demo.resize(500, 400)&nbsp; &nbsp; demo.show()&nbsp; &nbsp; app.exec()if __name__ == "__main__":&nbsp; &nbsp; main()<!doctype html><html><meta charset="utf-8"><head>&nbsp; &nbsp; <script src="qrc:///qtwebchannel/qwebchannel.js"></script></head><body><div id="placeholder">22</div><script>&nbsp; &nbsp; 'use strict';&nbsp; &nbsp; var placeholder = document.getElementById('placeholder');&nbsp; &nbsp; var updateText = function (text) {&nbsp; &nbsp; &nbsp; &nbsp; placeholder.innerHTML = text;&nbsp; &nbsp; &nbsp; &nbsp; console.log(text);&nbsp; &nbsp; }&nbsp; &nbsp; new QWebChannel(qt.webChannelTransport,&nbsp; &nbsp; &nbsp; &nbsp; function (channel) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var content = channel.objects.content;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; updateText(content.text);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; content.textChanged.connect(updateText);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; );</script></body></html>
0
随时随地看视频慕课网APP

相关分类

Python
我要回答