QML - Accessing QObject class properties which is stored in QList

Question

I am having trouble in accessing a property in QML.

QList is a property and i am able to access that but when i try to access the properties of classB in QML i am getting type error/Undefined. Following is the code:

[EDIT 1] - Changed the QList to QVariantList Based on the suggestion:

//ClassA.h

#include <QObject>
#include "classb.h"

Q_DECLARE_METATYPE(QList<ClassB*>)
class ClassA : public QObject
{
    Q_OBJECT
    Q_PROPERTY(QVariantList objList READ getClassBDetails) //[EDIT 1]

public:
    explicit ClassA(QObject *parent = nullptr);

    QVariantList getClassBDetails(); //[EDIT 1]

private:
    QVariantList  m_list; //[EDIT 1]
    ClassB m_Bobj;

};

//ClassA.cpp

#include "classa.h"

ClassA::ClassA(QObject *parent) : QObject(parent)
{
    m_list.append(QVariant::fromValue(&m_Bobj)); //** Appending to QvariantList
}

QVariantList  ClassA ::getClassBDetails() //[EDIT 1]
{
    return m_list;
}

//ClassB.h

#include <QObject>

class ClassB : public QObject
{
    Q_OBJECT
    Q_PROPERTY(int val READ getval WRITE setval NOTIFY valChanged)
public:
    explicit ClassB(QObject *parent = nullptr);

    int m_val = 10;

    int getval();
    void setval(int val);

signals:
    void valChanged();

public slots:
};

//ClassB.cpp

#include "classb.h"
ClassB::ClassB(QObject *parent) : QObject(parent)
{

}

int ClassB::getval()
{
    return m_val;
}

void ClassB::setval(int val)
{
    m_val = val;
    emit valChanged();
}

//Main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>
#include "classa.h"

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    ClassA aObj;
    QQmlApplicationEngine engine;
    engine.rootContext()->setContextProperty("classAObj",&aObj);
    engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
    if (engine.rootObjects().isEmpty())
        return -1;

    return app.exec();
}

//Main.qml

import QtQuick 2.6
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Component.onCompleted: {
        console.log("value========",classAObj.objList[0].val) //** Same error  
    }
}

If i try to access "classAObj.objList[0].val" i am getting TypeError: Cannot read property 'val' of undefined error. What is that i am doing wrong here ?

Answer 1

What you are doing wrong is expecting the [] operator to work. It won't.

There is one way to get it to work, if you convert your QList to a QVariantList which QML will automatically convert to a JS array.

But what I actually recommend is to simply use accessory functions instead, implement a get(index) and if necessary a set(index) function and you are set.

You can also take a look at this generic object list model, which is very flexible, powerful and useful, supports any QObject children, including objects that are defined in QML, declarative and nested definitions and last but not least, it can be directly used as a model.