主页 / ubuntu / 问题 / 552403
Accepted
Majster-pl
Asked: 2014-11-22 16:35:26 +0800 CST

解析JSON数据QML

  • 772

在主题中，我正在尝试将此 json 数据解析到我的 QML 项目中

链接： http ://www.rad.io/info/menu/valuesofcategory?category=_genre

所以我有 188 个元素的列表，但不知道如何获取每个元素的值...

这是我在此示例中使用的 JSONListModel 组件的链接

这是qml代码：

import QtQuick 2.0
import Ubuntu.Components 1.1
import "../components"
import Ubuntu.Components.ListItems 1.0 as ListItem


Page {
    title: i18n.tr("by Genre")


    JSONListModel {
        id: json
        source: "http://www.rad.io/info/menu/valuesofcategory?category=_genre"
        query: "$"
    }


    UbuntuListView {
        height: parent.height
        width: parent.width
        clip: true
        model: json.model
        cacheBuffer: contentHeight


        delegate: ListItem.Standard {
            text: index + "  " + indexValue
        }

    }    

}
qml

2 个回答

  1. Best Answer

    我不是 JSONListModel 方面的专家，所以我可能会弄错，但它似乎期望遍历对象列表。您从 rad.io 得到的是一个字符串列表，这似乎是您遇到问题的原因。但是由于您不需要对结果进行任何花哨的处理，因此很容易手动滚动。

    您要做的是将响应解析为一个列表（使用JSON.parse）。然后你可以遍历列表的元素。对于每个，您创建一个对象并将其附加到一个ListModel. 请注意，ListModel接受的是对象，而不是字符串。然后委托可以引用那些对象的属性。

    示例代码：

    import QtQuick 2.0
import Ubuntu.Components 1.1
import Ubuntu.Components.ListItems 1.0 as ListItem

MainView {
    width: 300
    height: 600
    property string source: "http://www.rad.io/info/menu/valuesofcategory?category=_genre"

    ListModel {
        id: listModel
    }

    Component.onCompleted: {
        var xhr = new XMLHttpRequest;
        xhr.open("GET", source);
        xhr.onreadystatechange = function() {
            if (xhr.readyState == XMLHttpRequest.DONE) {
                var list = JSON.parse(xhr.responseText);
                listModel.clear();
                for (var i in list)
                    listModel.append({ "genre": list[i] });
            }
        }
        xhr.send();
    }

    Page {
        title: i18n.tr("by Genre")

        UbuntuListView {
            height: parent.height
            width: parent.width
            clip: true
            model: listModel
            cacheBuffer: contentHeight

            delegate: ListItem.Standard {
                text: index + "  " + genre
            }
        }
    }
}

    让我花点时间提醒您发布简短、独立、正确的示例的重要性。您发布的代码无法运行不是因为解析 JSON 有任何问题，而是因为 aTab不能是顶级小部件。任何试图帮助你的人都必须先弄清楚这一点，然后才能解决真正的问题。

    此外，在使用非默认组件（如JSONListModel）时，请注意这一事实并向我们指出可以找到它的位置。重现问题所需的工作越少越好。

    • 5

  2. 实际上没有数据存储在您的 ListModel 中。

    我想你正在使用来自 GitHub的这个。

    JSONListModel是使用append(jsobject dict)QtQuick ListModel 中的方法填充的。此方法需要指定角色和值，但您从 rad.io 获取的 json 数据仅包含值。

    因此，ListElements 被添加到您的模型中，但它们不包含任何数据。您可以通过在委托中添加以下行来检查这一点：

    Component.onCompleted: {
    console.log(JSON.stringify(json.model.get(model.index)))
}

    我建议您使用XMLHttpRequest读取从网上下载的 json 文件的内容，然后对其进行解析并将其内容添加到字符串列表（或 var）中。您将能够使用modelData角色通过 ListView 访问内容。

    • 3

相关问题