QML repeater won't work when using a variable-CodePudding

I want to repeat from a string that I have in a variable.

From the documentation (and it works):

Column {
   Repeater {
       model: ["apples", "oranges", "pears"]
       Text { text: "Data: "   modelData }
   }
}

Now, I want to replace the model with a variable X, like this:

 Column {
    Repeater {
        model: X
        Text { text: "Data: "   modelData }
    }
 }

But it outputs nothing, no error. If I just show the content of X in a text label it shows this: ["apples", "oranges", "pears"], which is the exact content of my X variable.

So I'm not really sure how to approach it. I have to somehow make my string an object?

Using QT 5.12.6

CodePudding user response：

From the documentation:

Property names must begin with a lower case letter and can only contain letters, numbers and underscores.

When I'm using a upper case letter like X as the property name I get the following compile error:

error: Property names cannot begin with an upper case letter

If you use a lowercase x it will instead use the predefined x property of Repeater as it inherits Item.

If you want to make sure you get the correct x you should use ids like so:

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

Window {
    id: root
    width: 400
    height: 300
    visible: true

    property var x: ["apples", "oranges", "pears"]

    Column {
       Repeater {
           model: root.x
           Text { text: "Data: "   modelData }
       }
    }
}

As Jürgen Lutz said the type of your property is also important to know. It has to be of var type. If you are using Qt 6.4 and above you can also use the list type like so:

property list<string> test: ["apples", "oranges", "pears"]

CodePudding user response：

Firstly, you can assign your array to a property variable, and then access it later.

However, as you code more you realize it may be necessary to transition from arrays to ListModel.

In the following example, we populate two Repeaters, one with an array and one with the ListModel. You will see that Repeater attached to the ListModel will respond to changes to the ListModel. The array, however, when used as a model is immutable meaning that it will not see new elements added to the array. The workaround is you need to update the Repeater model to the newer versions of the array:

import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
Page {
    property var fruitArray: ["apples", "oranges", "pears"]
    ListModel {
        id: fruitModel
        ListElement { name: "apples" }
        ListElement { name: "oranges" }
        ListElement { name: "pears" }
    }
    RowLayout {
        width: parent.width
        ColumnLayout {
            Layout.alignment: Qt.AlignTop
            Repeater {
                id: arrayRepeater
                model: fruitArray
                Text { text: "fruitArray: "   modelData }
            }
        }
        ColumnLayout {
            Layout.alignment: Qt.AlignTop
            Repeater {
                model: fruitModel
                Text { text: "fruitModel: "   name }
            }
        }
    }
    footer: Frame {
        RowLayout {
            CheckBox {
                id: workaround
                text: qsTr("Workaround")
            }
            Button {
                text: qsTr("Add")
                onClicked: {
                    fruitArray.push("bananas");
                    fruitModel.append({name:"bananas"});
                    if (workaround.checked) {
                        arrayRepeater.model = fruitArray;
                    }
                }
            }
            Button {
                text: qsTr("Reset")
                onClicked: {
                    while (fruitArray.length > 3) fruitArray.pop();
                    while (fruitModel.count > 3) fruitModel.remove(fruitModel.count - 1);
                    if (workaround.checked) {
                        arrayRepeater.model = fruitArray;
                    }
                }
            }
        }
    } 
}

You can Try it Online!