Question

如何在QML / Javascript中使用QVector？示例：

C ++：

我在QML中使用的自定义类。该类包含返回已注册QVector

的ElementType的函数

class CustomType : public QObject
{
    Q_OBJECT

    public:
        Q_INVOKABLE QVector<ElementType*> getElements(); 
    //.....            
}
//.........
qmlRegisterType<CustomType>("CustomComponents", 1, 0, "CustomType");
qmlRegisterType<ElementType>("CustomComponents", 1, 0, "ElementType");
qRegisterMetaType<ElementType*>("ElementType*");

QML：

QML代码接收CustomType类（自定义）的实例，并尝试获取QVector<ElementType*>个元素并读取其属性。但是QML无法识别QVector类型。

//.......
function(){
    var elements = custom.getElements()
    elements[0].property   //?
}

Answer 1

需要使用QDeclarativeListProperty构建QML可访问列表属性。这适用于列表形状的所有内容，也适用于矢量。 This part of the Qt documentation有详细信息。

Answer 2

在您的示例中，您只需要从QList函数返回QObject* Q_INVOKABLE。请注意，以这种方式返回的所有对象都将具有JavaScript所有权，并在JavaScript函数返回时进行垃圾回收。要防止此行为，请在将对象推送到QList集合之前使用setObjectOwnership。有关在QML中使用集合的更多信息，请参阅QML Data Models

Answer 3

今年晚些时候我要回答，但是，这来了。这是一个简单的问题要解决。只需在C ++代码中使用Qt QVariantList类型而不是QVector。 Qt的QVariantList本质上是一个包含QVariant元素的QVector。一旦您知道自己在做什么，QVariant就会变得无所适从。同样，QML自动将C ++ QVariant转换为其等效的QML。因此，如果您在main.cpp中这样做：

#include <QCoreApplication>
#include <QGuiApplication>
#include <QQmlContext>
#include <QQuickView>

int main(int argc, char *argv[])
{
    // Prepare to enter the QML GUI world
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);

    // Create a QVariantList to be used instead of a QVector
    QVariantList dataList;
    dataList << "Item 1";
    dataList << 2;
    dataList << 3.3;

    // Create QML UI
    QQuickView view;

    // make your QVariantList visible to QML
    QQmlContext *ctxt = view.rootContext();
    ctxt->setContextProperty("myModel",
                             QVariant::fromValue(dataList));

    // show QML UI
    view.setSource(QUrl("qrc:/main.qml"));
    view.show();

    return 1;

} // main()

然后您可以在main.qml中执行此操作：

import QtQuick 2.12
import QtQuick.Window 2.12

Item
{
    // Print contents of C++ QVariantList to console
    function printMeBruh()
    {
        console.log("modelData contains:")
        console.log("-------------------")

        for (var i = 0; i < 3; i++)
        {
            console.log(myModel[i])
        }
    }

    Component.onCompleted: printMeBruh()

}

QV / Qavascript里面的QVector

3 个答案: