Json
{
"data": [
{
"addr": "testAddr1",
"name": "testName1",
"symbol": "testSymbol1"
},
{
"addr": "测试测试",
"name": "测试无BUG",
"symbol": "测试通过"
},
{
"addr": "nice",
"name": "今天不送测",
"symbol": "有需求明年再说"
},
{
"addr": "happy",
"name": "今晚上线",
"symbol": "version meeting"
}
]
}
|
解析后
|
qml: addr: testAddr1 name: testName1 symbol: testSymbol1 qml: addr: 测试测试 name: 测试无BUG symbol: 测试通过 qml: addr: nice name: 今天不送测 symbol: 有需求明年再说 qml: addr: happy name: 今晚上线 symbol: version meeting |
|---|
qml可以绘制界面，展示视图信息。在大数据、批量数据的情况下，信号与槽机制就显得不太灵活了。
就可以Json作为一种通信方式，完成数据的交互与储存。
在视图模型中：ListView、TableView等。运用较为广泛，qml却没有现成的JSON库提供序列化和反序列的操作。
此文档，就是提供出一个思路：在QML中如何构造Json，如何解析Json。
必备：
1、需要明白Json的组成元素和规则。（请自行百度）
2、需要明白从Json到string字符串添加了什么东西？两者的区别是什么？
3、QML中提供的JSON的解析规则是怎样的？
比如：
|
{ "data": { "data1":"test1", "data2":"test2" } } |
|---|
将上述的Json序列化到stringData
解析方式一：全解析
var jsonData=JSON.parse(stringData);
使用：
var data=jsonData.data;
var data1=jsonData.data.data1
var data2=jsonData.data.data2
解析方式二：部分解析
var jsonData=JSON.parse(stringData).data;
使用：
var data1=jsonData.data1
var data2=jsonData.data2
解析方式三：具体解析
var data1=JSON.parse(stringData).data.data1;
var data2=JSON.parse(stringData).data.data2;
区别：
1、qml提供出解析层级。即可以解析到某一个字段，并拿到里面的数据。
2、解析方式。qml的解析方式、字段读取，都是使用"."。对比其他Json库，----jsonData["data"]、jsonData["data"]["data1"]。
3、安全性。qml的Json解析是弱解析。意味着即使Json格式出错了、字段不存在等情况都不会崩溃，仅是警告处理。因此需要确保Json的正确性。
下面给出一个简单的ListView作为参考Demo
function jsonToString(model) {
var res = "{ \"data\": [\n";
console.log("count: " + model.count);
for(var i = 0; i < model.count; ++i) {
res += "\n{\t";
var e = model.get(i);
res += "\"addr\": \"" + e.addr + "\",\n\t";
res += "\"name\": \"" + e.name + "\",\n\t";
res += "\"symbol\": \"" + e.symbol +"\"\n\t";
// The last one should not have the ending ","
if ( i === model.count -1)
res += "\n}";
else
res += "\n},";
}
res += "\n]}";
console.log("res: " + res );
return res;
}
function stringToJson(stringData){
console.log("req stringData:",stringData);
var jsonData=JSON.parse(stringData).data;
//for(var i=0;i<jsonData.length;++i){
// console.log("addr:",jsonData[i].addr,
// " name:",jsonData[i].name,
// " symbol:",jsonData[i].symbol);
//}
return jsonData;
}
ListModel {
id: listModel
ListElement {
addr:"testAddr1"
name:"testName1"
symbol:"testSymbol1"
}
ListElement {
addr:"测试测试"
name:"测试无BUG"
symbol:"测试通过"
}
ListElement {
addr:"nice"
name:"今天不送测"
symbol:"有需求明年再说"
}
ListElement {
addr:"happy"
name:"今晚上线"
symbol:"version meeting"
}
}
ListView{
id: listview
width:256
height: 180
x:100
y:100
model: listModel
//delegate: listDelegate
}
//---------------------------------------------------------------------------------------------------------
//test
Rectangle{
x:50
y:50
width:200
height:30
border.width: 1
Text {
text: qsTr("序列化")
anchors.centerIn: parent
}
MouseArea{
anchors.fill: parent
onClicked: {
var data=jsonToString(listModel)
console.log(data);
}
}
}
Rectangle{
x:300
y:50
width:200
height:30
border.width: 1
Text {
text: qsTr("反序列化")
anchors.centerIn: parent
}
MouseArea{
anchors.fill: parent
onClicked: {
var data=jsonToString(listModel)
var jsonData=stringToJson(data)
console.log(jsonData);
for(var i=0;i<jsonData.length;++i){
console.log("addr:",jsonData[i].addr,
" name:",jsonData[i].name,
" symbol:",jsonData[i].symbol);
}
}
}
}
//test
|