过滤器数组elememts添加到listView

时间:2018-12-11 23:23:50

标签: arrays qt loops listview qml

我正在从Firebase数据库中读取数据,该数据库以以下格式保存嵌套数据,我想将其特定元素添加到listView中;

group {
    subgroup {
        index[0]{
            name: "Tom"
            message: "hello"
        }
        index[1]{
            name: "Dave"
            message: "goodbye"
        }
        index[2]{
            name: "Katie"
            message: "morning"
        }
    }
}

我想做的是将namemessage属性添加到我的应用程序中的listView中,当我的应用程序启动时使用Firebase中的数据创建一个数组,因此我需要检查name属性,并在适用时添加到列表视图。

我已经使用循环和图像可见性在日历上显示标记,是否有类似的遍历数组的方法是创建列表的最佳选择?我确实需要在日历上的特定日期创建列表,并使用相同的方法使用1个或多个用户名条目。

通过在控制台中使用以下代码循环显示我想要的内容。但是,如果要添加name,下面的代码可以正常工作,但是将两个都添加到我的列表中是行不通的。我的代码是;

var nameArr = (JSON.stringify(value))
var parseData = JSON.parse(nameArr);
    for(var index in parseData)
        console.log("nameParse: ", parseData[index].name, ":", "detailsParse: ", parseData[index].message)



        ListView {
            id:eventListView
            spacing: 4
            clip: true
            anchors.fill: parent
            anchors.margins: 10
            model: ListModel {id: model }

            Component.onCompleted: {
                model.clear();
                var list = parseData;
                for(var i in list)
                    model.append({"name": list[i].name, "details": list[i].message});          

            }

    delegate: Label {
          id: nameLabel                  
          text: modelData.name
          }
          Label {
          id: timeLabel
          text: modelData.message
          }
      }

1 个答案:

答案 0 :(得分:0)

Java数组可以通过以下方式用作数据源:

ListView {
    anchors.fill: parent
    property var group: {
        "subgroup":  [
            {
                "name": "Tom",
                "message": "hello"
            },
            {
                "name": "Dave",
                "message": "goodbye"
            },
            {
                "name": "Katie",
                "message": "morning"
            }
        ]
    }
    model: group.subgroup
    delegate: Text { text: modelData.name }
}