如何为此数据创建模型/商店？

Question

我有一个名为data.json一个JSON文件，它包含以下JSON：

{ 
    "lists": [ 
     { 
      "id":100, 
      "title":"Grocery", 
      "description":"Bryce & Madi", 
      "items": [ 
       { 
        "name":"Milk", 
        "quantity":"2 Gallons", 
        "checked":false 
       }, 
       { 
        "name":"Sugar", 
        "quantity":"2 Cups", 
        "checked":true 
       } 
      ] 
     }, 
     { 
      "id":200, 
      "title":"Christmas", 
      "description":"Our Christmas List", 
      "items": [ 
       { 
        "name":"Shaver", 
        "quantity":"1", 
        "checked":false 
       }, 
       { 
        "name":"Football", 
        "quantity":"1", 
        "checked":true 
       } 
      ] 
     } 
    ] 
} 

我试图创建一个模型/存储这个数据让我看到第一只主清单页面，然后他们可以单击一个列表，并将它们带到一个页面，该列表将该列表中的items显示为一个列表。

任何人都可以指向正确的方向吗？我一直在围绕这个结构缠绕我的头。如果有帮助，这是我有：

App.models.Lists = Ext.regModel("App.models.Lists", { 
    hasMany: { model: App.models.List, name: 'list' }, 
    fields: [ 
     { name: "id", type: "int" }, 
     { name: "title", type: "string" }, 
     { name: "description", type: "string" }, 
     { name: "items", type: "auto" } 
    ] 
}); 

App.stores.Lists = new Ext.data.Store({ 
    model: "App.models.Lists", 
    proxy: { 
     type: 'ajax', 
     url: 'data.json', 
     id: 'AppLocalStore', 
     reader: { 
      type: 'json', 
      root: 'lists' 
     } 
    }, 
    listeners: { 
     'load': function(store, records, options) { 
      console.log(records); 
     } 
    } 
}); 

Answer 1

我想，你应该使用为您的需求TreeStore和NestedList。

“在KitchenSink的UserInterface下查看嵌套列表示例”可能会有帮助。