Sencha Touch 中的 JSON 数据

Question

我目前正在使用 Sencha Touch，并尝试使用 JSON 视图从 drupal 安装中获取数据。我查看了 Sencha API 文档，但无法让它工作。

我的 Json 响应如下：

{
  "spots" : [
    {
      "spot" : {
        "nid" : "10",
        "created" : "1288868246",
        "title" : "Almanarre",
        "type" : "spot",
        "city" : "Hyères",
        "country" : "fr",
        "latitude" : "43.083433",
        "longitude" : "6.148224"
      }
    },
    {
      "spot" : {
        "nid" : "11",
        "created" : "1288956341",
        "title" : "Lac de Neuchâtel",
        "type" : "spot",
        "city" : "Dakhla",
        "country" : "ma",
        "latitude" : "23.866295",
        "longitude" : "-15.738344"
      }
    },
    {
      "spot" : {
        "nid" : "12",
        "created" : "1288958572",
        "title" : "Zurich",
        "type" : "spot",
        "city" : "Zurich",
        "country" : "ch",
        "latitude" : "0.000000",
        "longitude" : "0.000000"
      }
    },
    {
      "spot" : {
        "nid" : "13",
        "created" : "1289302233",
        "title" : "Berne",
        "type" : "spot",
        "city" : "Berne",
        "country" : "ch",
        "latitude" : "46.947999",
        "longitude" : "7.448148"
      }
    },
    {
      "spot" : {
        "nid" : "14",
        "created" : "1290266721",
        "title" : "Dakhla",
        "type" : "spot",
        "city" : "Rio de Janeiro",
        "country" : "br",
        "latitude" : "-22.903539",
        "longitude" : "-43.209587"
      }
    },
    {
      "spot" : {
        "nid" : "15",
        "created" : "1299172773",
        "title" : "Paje",
        "type" : "spot",
        "city" : "Paje",
        "country" : "tz",
        "latitude" : "-6.265646",
        "longitude" : "39.535332"
      }
    }
  ]
}

我的 Model/Store/List ：

Ext.regModel( 'Spot', {
            idProperty: 'id',
            fields : [
                { name: 'id', type: 'int'},
                { name: 'date', type: 'date', dateFormat: 'c' },
                { name: 'title', type: 'string'},
                { name: 'type', type: 'string'},
                { name: 'country', type: 'string'},
                { name : 'city', type: 'string' },
                { name : 'lat', type: 'string' },
                { name: 'long', type: 'string'}
            ]
        }); // Model


        Ext.regStore('spotStore', {
            model: 'Spot',
            proxy: {
                type: 'ajax',
                url: '/api/spots/',
                reader: {
                    type: 'json',
                    root: 'spots'
                },
                autoload: true
            }
        });
ks.views.spotsList = new Ext.List({
            id: 'spotsList',
            store: 'spotStore',
            itemTpl: '<div class="list-item-title">{title}</div>' + '<div class="list-item-narrative">{country}</div>',
            onItemDisclosure: function(record){

            },
            listeners: {
                'render': function (thisComponent) {
                    thisComponent.getStore().load();
                }
            }
        });

进行调用后，它会创建准确数量为 6 个项目的列表。但我无法使 itemTpl 中的变量显示出来......

有什么想法吗？

多谢 ！

Answer 1

问题在于您在创建商店时提到的根变量。我建议对 Json 格式进行一些更改
即

{
    "spots": [
        {
            "nid": "10",
            "created": "1288868246",
            "title": "Almanarre",
            "type": "spot",
            "city": "Hyères",
            "country": "fr",
            "latitude": "43.083433",
            "longitude": "6.148224"
        },
        {
            "nid": "11",
            "created": "1288956341",
            "title": "Lac de Neuchâtel",
            "type": "spot",
            "city": "Dakhla",
            "country": "ma",
            "latitude": "23.866295",
            "longitude": "-15.738344"
        },
        {
            "nid": "12",
            "created": "1288958572",
            "title": "Zurich",
            "type": "spot",
            "city": "Zurich",
            "country": "ch",
            "latitude": "0.000000",
            "longitude": "0.000000"
        },
        {
            "nid": "13",
            "created": "1289302233",
            "title": "Berne",
            "type": "spot",
            "city": "Berne",
            "country": "ch",
            "latitude": "46.947999",
            "longitude": "7.448148"
        },
        {
            "nid": "14",
            "created": "1290266721",
            "title": "Dakhla",
            "type": "spot",
            "city": "Rio de Janeiro",
            "country": "br",
            "latitude": "-22.903539",
            "longitude": "-43.209587"
        },
        {
            "nid": "15",
            "created": "1299172773",
            "title": "Paje",
            "type": "spot",
            "city": "Paje",
            "country": "tz",
            "latitude": "-6.265646",
            "longitude": "39.535332"
        }
    ]
}

希望它会有所帮助...