Как динамически создавать шаблоны xtype в Sencha Touch

Question

Итак, у меня есть представление и контроллер, связанный с этим представлением, и я хотел бы динамически присваивать значения элементу xtype в представлении через хранилище.

Так, например, я хотел бы динамически настройки layouts (пожалуйста, посмотрите на proveded код) и urls

items: [ 
     { 
      itemId: 'nav_home', 
      id: 'homeView', 
      layout: "{layout}", 
      items: [{ 
       xtype: 'articlelist', 
       id: 'latestNews', 
       url: {url}, 
      } 
     ], 
    }, 

Может кто-нибудь привести меня, как подойти к этой задаче?

Благодаря

Answer 1

Вы можете использовать функцию инициализации для визуализации компонентов на основе некоторых условий. Вот пример:

Ext.define('MyApp.view.MyView', { 
    extend: 'Ext.Container', 
    alias : 'widget.myview', 
    config: { 
     items : [], 
     mylayout: null 
    }, 
    initialize : function(){ 
     var me = this; 
     if(me.config.mylayout == 'horizontal'){ 
      me.add({ 
       xtype : 'panel', 
       layout : 'hbox', 
       items : [{ 
        xtype : 'panel', 
        html : 'first content' 
       }, 
       { 
        xtype : 'panel', 
        html : 'second content' 
       }] 
      }); 
     } else if(me.config.mylayout == 'vertical'){ 
      me.add({ 
       xtype : 'panel', 
       layout : 'vbox', 
       items : [{ 
        xtype : 'panel', 
        html : 'first content' 
       }, 
       { 
        xtype : 'panel', 
        html : 'second content' 
       }, 
       { 
        xtype : 'panel', 
        html : 'third content' 
       }] 
      }); 
     } 
     me.callParent(); 
    } 
}); 

Вы можете создать этот вид, как это:

var myView = Ext.create("MyApp.view.MyView", { 
    mylayout : 'vertical' 
}); 

mylayout может быть любой объект конфигурации, которую вы хотите передать.