Javascript Sencha Touch框架中的左侧导航视图（关于Ext.data.TreeStore的问题）

我想动态设置左侧导航菜单，就像iPad风格一样。 因此，我对演示示例进行了一些修改。您还可以访问这个官方示例

为了便于实现，我尝试从words.JSON中获取JSON数据。 理想情况下，JSONP类型更好…尝试过，但没有运气

以下是words.json的内容：

{
    text: 'User Interface',
    cls: 'launchscreen',
    items: [{
        text: 'Buttons',
        card: demos.Buttons,
        source: 'src/demos/buttons.js',
        leaf: true
    },  
    {   
        text: 'Forms',
        card: demos.Forms,
        source: 'src/demos/forms.js',
        leaf: true
    },  
    {   
        text: 'List',
        card: demos.List,
        source: 'src/demos/list.js',
        leaf: true
    }]  
}

结果什么也没出现。发生了什么？我弄错了吗？原料药

我想做什么？ 和字典一样，左边是单词的导航项。点击它，单词的意思将显示在右侧视图中

我无法在中运行NestedList示例。单击表格单元格并在其上推送另一个视图，即在Sencha:NestedList中，这是我想要做的

尝试过但没有运气： 使用NestedList示例 用ScriptTagProxy JSONP替换代理 使用代码中显示的更简单的代理实现

---

我不太确定我的描述是否足够清楚，请告诉我哪部分不清楚。提前谢谢你

如果words.json看起来像上面的内容，那么这可能是您的问题

这就是它应该看起来的样子

{
    "text": "User Interface",
    "cls": "launchscreen",
    "items": [{
        "text": "Buttons",
        "source": "src/demos/buttons.js",
        "leaf": true
    }, {
        "text": "Forms",
        "source": "src/demos/forms.js",
        "leaf": true
    }, {
        "text": "List",
        "source": "src/demos/list.js",
        "leaf": true
    }]
}

我还附加了一个完整的工作副本，使用内存代理默认值和ajax代理

Ext.regApplication({
    name: 'test',
    launch : function(){
        var nL = new Ext.NestedList({
            store: test.stores.testTreeStore,
            fullscreen: true,
            itemTextTpl : '{text}'
        });
    }
});
Ext.ns('test.data');

test.data.words = {
    text: 'User Interface',
    cls: 'launchscreen',
    items: [{
        text: 'Buttons',
        source: 'src/demos/buttons.js',
        leaf: true
    },  
    {   
        text: 'Forms',
        source: 'src/demos/forms.js',
        leaf: true
    },  
    {   
        text: 'List',
        source: 'src/demos/list.js',
        leaf: true
    }]  
};

test.models.testTreeModel = Ext.regModel('testTreeModel', {
    fields: ['text','source','card','leaf'],
    proxy: {
        type: 'memory',
        data: test.data.words,
        //type: 'ajax',
        //url: 'words.json',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});
test.stores.testTreeStore = new Ext.data.TreeStore({
    model: 'testTreeModel'
});

---

非常感谢，我将尝试一下！

Ext.regApplication({
    name: 'test',
    launch : function(){
        var nL = new Ext.NestedList({
            store: test.stores.testTreeStore,
            fullscreen: true,
            itemTextTpl : '{text}'
        });
    }
});
Ext.ns('test.data');

test.data.words = {
    text: 'User Interface',
    cls: 'launchscreen',
    items: [{
        text: 'Buttons',
        source: 'src/demos/buttons.js',
        leaf: true
    },  
    {   
        text: 'Forms',
        source: 'src/demos/forms.js',
        leaf: true
    },  
    {   
        text: 'List',
        source: 'src/demos/list.js',
        leaf: true
    }]  
};

test.models.testTreeModel = Ext.regModel('testTreeModel', {
    fields: ['text','source','card','leaf'],
    proxy: {
        type: 'memory',
        data: test.data.words,
        //type: 'ajax',
        //url: 'words.json',
        reader: {
            type: 'json',
            root: 'items'
        }
    }
});
test.stores.testTreeStore = new Ext.data.TreeStore({
    model: 'testTreeModel'
});