QML中展⽰json数据（从c++传递的值）
1.前⾔
最近在搞qml，从服务器上获取⼀段json数据，本想直接传送⾄qml中展⽰，⽆奈，qt的官⽅⽂档中没有关于json如何在listview/listmodel 中展⽰的⽰例代码。
从⽹上看到jsonmodel的第三⽅模块，但是觉得挺⿇烦的，后来到⼀种新的解法，下⾯写出来。
2.JSON代码从c++传⾄qml中
main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <jsondata.h>
#include <QQmlContext>
int main(int argc, char *argv[])
{
QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
QGuiApplication app(argc, argv);
JsonData jsondata;
QQmlApplicationEngine engine;
engine.load(QUrl(QLatin1String("qrc:/main.qml")));
if (Objects().isEmpty())
return -1;
();
}
把QString类型字符串注册成为qml的属性，再在qml中⽤JavaScript解析成json变量。
jsondata.h
#ifndef JSONDATA_H
#define JSONDATA_H
#include <QObject>
class JsonData : public QObject
{
Q_OBJECT
Q_PROPERTY(QString man READ man NOTIFY manChanged)
public:
JsonData();
QString man() {return  QString("[{\"name\":\"Joy\",\"age\":30},{\"name\":\"James\",\"age\":36},{\"name\":\"Lily\",\"age\":20}]");}
qt listviewsignals:
void  manChanged();
private:
QString man2;
};
#endif // JSONDATA_H
jsondata.cpp
#include "jsondata.h"
JsonData::JsonData()
{
}
main.qml
import QtQuick 2.0
import QtQuick.Controls 2.1
import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.1
ApplicationWindow {
id:rect
width: 400
height: 200
visible: true
property var json_man: JSON.parse(jsondata.man) }
3.把JSON数据展⽰在listmodel中main.qml
import QtQuick 2.0
import QtQuick.Controls 2.1
import QtQuick.Controls.Styles 1.4
import QtQuick.Layouts 1.1
ApplicationWindow {
id:rect
width: 400
height: 200
visible: true
property var json_man: JSON.parse(jsondata.man)
ListView {
id:man_table
x: 20
y: 20
width: 359
height: 158
keyNavigationWraps: false
snapMode: ListView.SnapToItem
highlightRangeMode: ListView.ApplyRange
anchors.margins: 5
spacing: 3
model: json_man
delegate: table_model
}
Component{
id:table_model
RowLayout{
spacing:  10
Layout.fillWidth:true
Label{
text: json_man[index].name
}
Label{
text: json_man[index].age
}
}
}
}
4.总结
json数据格式是很好⽤的，能直接展⽰出来，简直很完美！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。