2013-02-15 80 views
3

我试图将JSON数据加载到NestedList中。我在/app/store/Exhibits.jsSencha Touch 2:'指定的商店无法找到'

以下存储文件
Ext.define('VisitTCMIndy.store.Exhibits',{ 
requires: ['VisitTCMIndy.model.Exhibit', 'Ext.data.proxy.JsonP'], 
extend: 'Ext.data.TreeStore', 
config: { 
    model: 'VisitTCMIndy.model.Exhibit', 
    proxy: { 
     type: 'jsonp', 
     url: 'http://www.example.com/explore.php', 
     reader: { 
      type: 'json', 
      rootPropery: 'children' 
     } 
    } 
} 
}); 

然后,我引用它在下面的视图中/app/view/Explore.js

Ext.define('VisitTCMIndy.view.Explore', { 
extend: 'Ext.Container', 
requires: [ 
    'Ext.data.TreeStore', 
    'Ext.dataview.NestedList', 
    'VisitTCMIndy.store.Exhibits', 
], 
xtype: 'explorecard', 
config: { 
    iconCls: 'compass1', 
    title: 'Explore', 
    layout: 'fit', 
    items: [ 
     { 
      xtype: 'titlebar', 
      docked: 'top', 
      title: 'Explore' 
     }, 
     { 
      xtype: 'nestedlist', 
      fullscreen: true, 
      store: 'VisitTCMIndy.store.Exhibits', 
      detailCard: { 
       html: 'Explore Details' 
      }, 
      listeners: { 
       leafitemtap: function(nestedList, list, index, target, record){ 
        var detailCard = nestedList.getDetailCard(); 
        detailCard.setHtml('Exhibit Title: '+ record.get('title')); 
       } 
      } 
     } 

    ] 
} 
}); 

我得到以下警告,当我去的网页空列表:

[WARN] [Ext.dataview.NestedList#applyStore]指定的商店无法找到

在我的生活中,我无法弄清楚我做错了什么。

回答

5

好的。原来,我不得不在我的app.js文件中声明我的商店和模型。然后在没有剩下的类定义的情况下通过它的名称引用我的商店。所以,我添加了以下内容到我的app.js文件中:

models: ['Exhibit'], 
stores: ['Exhibits'], 

然后,这是我更新的Explore.js视图文件。

Ext.define('VisitTCMIndy.view.Explore', { 
extend: 'Ext.Container', 
requires: [ 
    'Ext.data.TreeStore', 
    'Ext.dataview.NestedList', 
    'VisitTCMIndy.store.Exhibits', 
], 
xtype: 'explorecard', 
config: { 
    iconCls: 'compass1', 
    title: 'Explore', 
    layout: 'vbox', 
    items: [ 
     { 
      xtype: 'titlebar', 
      docked: 'top', 
      title: 'Explore' 
     }, 
     { 
      xtype: 'nestedlist', 
      store: 'Exhibits', 
      title: 'Museum Levels', 
      displayField: 'title', 
      detailCard: { 
       html: 'Explore Details' 
      }, 
      listeners: { 
       leafitemtap: function(nestedList, list, index, target, record){ 
        var detailCard = nestedList.getDetailCard(); 
        detailCard.setHtml('<div style="text-align:center;margin:.5em;"><img src="'+record.get('image')+'" alt="'+record.get('title')+'" />'+ 
         '<p style="text-align:left;">'+record.get('text')+'</p></div>' 
        ); 
       } 
      }, 
      flex: 1 
     } 

    ] 
} 
}); 

此外,请注意我将布局从适合更改为vbox。我必须这样做,然后给列表一个flex,以便列表实际显示它正在加载数据。

相关问题