QVariantList及QVariantMap在qml里的使用_qml qvariantmap

在用qml开发实际项目中，我们经常遇到需要在C++这边处理数据，然后将数据整理好交由qml显示。
而对于一些批量的数据，我们一般会将其封装成List或者Map的形式。
QVariantList以及QStringList在qml中是可以被识别的。直接通过索引，比如 mList[i] 就可以访问；

但是map就不能直接访问，需要做一些处理（通过for去获取其keys，然后通过key来访问其值）。

下面介绍一种方法：

在c++中，有一个函数，返回的是QVariantList类型的返回值。这个list中的成员，是QvariantMap类型的数据：

QVariantList Manager::getFlowConfiguration()
{
    QVariantList cfgList;
    
    QMap<int, QVariantMap> tempMap;
      
     ......
     
    for(auto key : tempMap.keys())
    {
        cfgList.push_back(tempMap[key]);
    }

    return cfgList;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

然后在qml中可以这样子用：

ListView{
id：root

    ......
    
    property ListModel myModels: ListModel{}

    function loadData()
    {
        var tempModel = manager.getFlowConfiguration()

        myModels.clear()
        
        //QVariantList的拆解
        for(var i = 0; i < tempModel.length; i++)
        {
            var count = 0
            var data = tempModel[i]
            var dataList = [] //一个容器，用于存放json变量
            
            //QVariantMap的拆解
            for(var key in data)
            {
                dataList.push({"name":key, "state":data[key]})
                count++
            }
            
            myModels.append({"count":count, "listData":dataList})
        }

        //改变listview的model
        model = myModels
    }
    
    delegate：Rectangle{
     Text{text："共有" + count + "个机关"}
     Grid{
                Repeater {
                    model: listData
                    delegate：Text{text：name}
             }
    }

 .....
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47

得到的结果展示如下图所示
其中步骤1、2、3那里是第一阶的listview
智能灯、智能灯一、智能灯二那里是二阶的listview（其实是Grid）。