Sencha Touch 2.3.0 NestedList在点击时不显示子项，而只显示根项

Question

更新 Demo of the problem

我是Sencha Touch的新手，我正在努力让NestedList工作。

我已经设置了两个模型文件，一个带有ajax代理的商店，用于加载本地json文件，以及包含NestedList的视图。

NestedList显示我的json文件中的根元素，所以到目前为止一直都在工作。

但是，当我点击其中一个项目时，它会为视图设置动画，但结果列表仅显示父项目，但这次使用标题栏中的后退按钮：

我真的不明白我在这里做错了什么。

JSON （精简版）

{
"countries":[
{"name":"Germany","countryCode":"de","cities":[
    {"name":"Berlin"},{"name":"Muenchen"}]},
{"name":"France","countryCode":"fr","cities":[
    {"name":"Paris"},{"name":"Lyon"}]},
{"name":"United Kingdom","countryCode":"uk","cities":[
    {"name":"London"},{"name":"Leicester"}]}]
}

模型

1. 城市：

   Ext.define('MyApp.model.City', {
       extend: 'Ext.data.Model',
       config: {
           fields: [{ name: 'name', type: 'string' }]
       }
   });
   

2. 国家：

   Ext.define('MyApp.model.Country', {
       extend: 'Ext.data.Model',
   
       require: [
           "MyApp.model.City"
       ],
   
       config: {
           fields: [
               { name: 'name', type: 'string' },
               { name: 'countryCode', type: 'string' }
           ],
           hasMany: [{ model: "MyApp.model.City", name: "cities" }]
       },
   });
   

TreeStore

Ext.define('MyApp.store.CountryTreeStore', {
    extend: 'Ext.data.TreeStore',

    config: {
        autoLoad: true,
        model: "MyApp.model.Country",
        defaultRootProperty: "countries",
        proxy: {
            type: "ajax",
            url: "/data/data.json",
            reader: {
                type: "json"
            }
        }
    }
});

部分来自视图

items: [
    {
        xtype: 'nestedlist',
        store: "CountryTreeStore",
        displayField: "name"
    }
]

更新 在load（TreeStore）的proxy事件侦听器中设置断点并检查“已加载”存储对象，显示它具有带有正确数据的cities属性

Answer 1

是的，我试图重构你的问题。当我将json中的关键“城市”设置为“国家”，或者从上一级别设置相同的密钥时，它似乎有效。所以这是你的“hasMany” - 关系不起作用。我从来没有试过这样做。因此，当您删除“hasMany”关联，并将json更改为此时，它将起作用：

[{
"countries":[
{"name":"Germany","countryCode":"de","countries":[
{"name":"Berlin", leaf: true},{"name":"Muenchen", leaf: true}]},
{"name":"France","countryCode":"fr","countries":[
{"name":"Paris", leaf: true},{"name":"Lyon", leaf: true}]},
{"name":"United Kingdom","countryCode":"uk","countries":[
{"name":"London", leaf: true},{"name":"Leicester", leaf: true}]}]
}]

和“leaf：true”你可以听到“leafitemtap”事件，当你到达树的末尾时做一些事情。

你在哪里找到了“hasMany”相关的例子？也许只是缺少一点东西;）

Answer 2

您是否尝试在最后一个项目级别设置leaf: true？ {"name":"Muenchen", "leaf": true}