Implementierung interaktiver Daten zwischen QT und Javascript

Implementierung interaktiver Daten zwischen QT und Javascript

1. Daten fließen von QT zu JS
1. QT ruft die JS-Funktion auf und JS erhält den Wert von QT über den Parameter
2. JS ruft die QT-Funktion auf und der Rückgabewert der QT-Funktion geht in JS ein
2. Datenflüsse von JS zu QT
1. JS ruft die Funktion von QT auf und QT erhält den Wert von JS über den formalen Parameter
2. QT ruft die JS-Funktion auf und der Rückgabewert der JS-Funktion geht in QT ein

1. QT übergibt Array an JS

Grundlegende Typen wie int, bool, string, double usw. können direkt übergeben werden.

Wenn qt ein Array an js übergibt, muss das Array in QJsonArray konvertiert werden und dann QJsonArray in QString. Auf diese Weise erhält js eine Zeichenfolge vom Basistyp, und diese Zeichenfolge ist direkt ein Standard-js-Array in js.

QT-Codebeispiel: Rufen Sie eine js-Funktion auf und übergeben Sie ein Array als Parameter an die js-Funktion

    //Methode 1: Erstellen Sie QJsonArray und konvertieren Sie es dann in QString
    QJsonArray ja;
    ja << 3 << 4 << 5;
    : QString jpar = QString(QJsonDocument(ja).toJson());
    QString cmd = QString("qtPara(%0)").arg(QString(QJsonDocument(ja).toJson()));
    //Methode 2: Schreiben Sie das Array direkt als String
// QString cmd = QString("qtPara([13,14,15])");
 
    //JS-Funktion ausführen webView->page()->runJavaScript(cmd);

Die vom obigen Code aufgerufene Javascript-Funktion ist:

 Funktion qtPara(numList)
 { 
  alert("js alert: " + numList); //Zeige das gesamte von qt gesendete Array an alert("js alert[0]: " + numList[0]); //Zeige das 0. Element des von qt gesendeten Arrays an }

2. JS übergibt Array an QT

Wenn JS ein Array an QT übergibt, konvertiert QT diesen Wert in QJsonArray

JS kann auch jedes JS-Objekt an QT übergeben, daher muss QT es in QJsonObject konvertieren

QT-Endbeispielcode:

    : QString cmd = QString("jsString()");
 
    webView->Seite()->JavaScript ausführen(cmd, [](const QVariant &v)
    {
        //Fall 1: Wenn js eine Zahl zurückgibt qDebug() << "qt call js = " << v.toDouble();
        //Fall 2: Wenn js einen String-Wert zurückgibt qDebug() << "qt call js = " << v.toString();
        //Fall 3: Wenn js ein js-Array zurückgibt QJsonArray ja = v.toJsonArray();
        qDebug() << "j[0] = " << ja.at(0).toDouble();
        //Fall 4: Wenn js ein js-Objekt zurückgibt QJsonObject jo = v.toJsonObject();
        qDebug() << jo;
    });

Die durch den obigen Code aufgerufene JS-Funktion:

// var jArr = [120.123456789, 22, 33, 44]; //js-Array
 // var jObj = {"num":[120.123456789, 22, 33, 44], "name":"Tom"}; //json
var jNum = 120,1234567;
 Funktion jsString()
 {
   Warnung("jsString");
   //jNum zurückgeben;
   //jArr zurückgeben;
   //jObj zurückgeben;
 }

3. JS übergibt alle Arten von Daten an QT

Die QT-Seite empfängt es mit dem Typ QVariant und qDebuggt dann diesen Wert. Sie können sehen, wie dieser JS-Wert als QVariant gekapselt ist, und dann können wir

Beispielsweise gibt JS einen Wert wie diesen an QT zurück. Dabei handelt es sich um ein Array von JS-Objekten, bei dem jedes Element ein Punktobjekt ist und dieses Punktobjekt über die Attributwerte lng und lat verfügt.

Pfad = [neuer Punkt(116.387112,39.920977), neuer Punkt(116.387112,39.920977)];

Nachdem QT es empfangen hat, führt es ein qDebugging wie folgt durch:

QVariant(QVariantList,
(QVariant(QVariantMap, QMap(("lat", QVariant(double, 39.921))("lng", QVariant(double, 116.387)))),
QVariant(QVariantMap, QMap(("lat", QVariant(double, 39.921))("lng", QVariant(double, 116.387)))))

Wir fanden heraus, dass

① QT kapselt das JS-Objektarray in QVariantList, d. h. QList <QVariant>,

② Jedes Mitglied dieser Liste wird von QT in eine QVariantMap gekapselt, d. h. QMap<QString, QVariant>

③ Der Schlüssel in jeder Karte ist QString, der Wert ist QVariant und diese QVariant ist doppelt.

Nach den oben genannten Analyseschritten können wir alle von JS an QT gesendeten Daten problemlos analysieren.

Dies ist das Ende dieses Artikels über die Implementierung interaktiver Daten zwischen QT und JavaScript. Weitere relevante Inhalte zur Interaktion zwischen QT und JavaScript finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!

Das könnte Sie auch interessieren:
  • So lässt man QWebEngineView in PyQt5 mit JavaScript interagieren

<<:  Detaillierte Erklärung des Unterschieds zwischen "/" und "~" in Linux

>>:  Die Fallstricke und Lösungen, die durch den Standardwert von sql_mode in MySQL 5.7 verursacht werden

Artikel empfehlen

Zusammenfassung gängiger Befehle für Ubuntu-Server

Die meisten der folgenden Befehle müssen in der K...

JavaScript-Implementierung der Dropdown-Liste

In diesem Artikelbeispiel wird der spezifische Ja...

4 Lösungen für CSS-Browserkompatibilitätsprobleme

Frontend ist ein harter Job, nicht nur weil sich ...

Detaillierte Schritte zur schnellen Installation von Openshift

Der schnellste Weg, die neueste Version von OpenS...

Detaillierte Erläuterung gängiger Methoden der Vue-Entwicklung

Inhaltsverzeichnis $nächsterTick() $forceUpdate()...

So installieren Sie Git unter Linux

1. Einleitung Git ist ein kostenloses, verteiltes...

js Drag & Drop-Tabelle zur Realisierung der Inhaltsberechnung

In diesem Artikelbeispiel wird der spezifische Co...

Rundungsvorgang des Datums-/Uhrzeitfelds in MySQL

Inhaltsverzeichnis Vorwort 1. Hintergrund 2. Simu...

Eine einfache Möglichkeit, das Passwort in MySQL 5.7 zu ändern

Dies ist ein offizieller Screenshot. Nach der Ins...

html Option deaktivieren auswählen auswählen deaktivieren Option Beispiel

Code kopieren Der Code lautet wie folgt: <Ausw...

Semantisierung von HTML-Tags (einschließlich H5)

einführen HTML stellt die kontextuelle Struktur u...