用存儲填充自定義組件

Question

我試圖在Sencha Touch 2項目中使用商店（實際上是存儲本地數據）來填充自定義組件。

我的想法是爲商店中的每個元素創建一個自定義組件，但實際上沒有任何反應。

我已經嘗試了幾件事情，但任何工作，你能幫我嗎？我做了一個例子來說明這個問題：

型號：

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

店：

Ext.define('project.store.cities', { 
    extend: 'Ext.data.Store', 
    requires: ['project.model.city'], 
    model: 'project.model.city', 
    autoLoad: true, 
    data: [ 
    { country: 'Germany', city: 'Berlin' }, 
    { country: 'Italy', city: 'Rome' } 
    ] 
}); 

查看與店：

Ext.define('project.view.cityAll', { 
    extend: 'Ext.Panel', 
    xtype: 'cityAllView', 
    config: { 
    items:[{ 
     xtype: 'cityItemView', 
     store: 'project.store.cities', 
    }] 
    } 
}); 

自定義組件查看：

Ext.define('project.view.cityItem', { 
    extend: 'Ext.Panel', 
    xtype: 'cityItemView', 
    config: { 
    items: [{ 
     itemTpl: '{city}' 
    }] 
    } 
}); 

Answer 1

您需要分配店cityItemView而不是cityAllView。 cityItemView正在指定模板並需要加載數據。

Ext.define('project.view.cityItem', { 
    extend: 'Ext.Panel', 
    xtype: 'cityItemView', 
    config: { 
    items: [{ 
     xtype:'list', 
     itemTpl: '{city}' 
     store:'project.store.cities' 
    }] 
    } 
}); 

如果要將數據設置爲面板，則需要撥打setData()。面板無法直接從商店加載數據。您可以使用列表視圖，以顯示城市，國家對。 cityView不再需要以這種方式存儲財產。

試試看。

Answer 2

您可以通過記錄這將環路店負載添加監聽器，並創造儘可能多的面板：

listeners : { 
     load: function(me, records, successful, operation, eOpts){ 
      var plist = []; 
      var cv = Ext.Create('project.view.cityAll'); 
      if(successful){ 

       var data = records[i].getData(); 
       for(var i=0; i<records.length; i++){ 
        plist.push({ 
         xtype : 'cityItemView', 
         data : data 
        }); 
       } 
       cv.add(plist); 
      } 
      // Now add cv to viewport or wherever you want 
     } 
} 

你必須改變cityItemView使用任何你想要的方式的數據。如果你正在使用初始化方法，你可以像this.config.data