2012-04-06 54 views
0

我想要的是能夠一次創建兩個Panel實例,但是當我執行諸如new Dashboard.NotificationPanel(); new Dashboard.NotificationPanel();之類的操作時,第一個不顯示網格結果。我懷疑它以某種方式與initComponent階段連接,特別是兩個對象通過引用使用相同的存儲對象。請糾正我,如果我錯了或指出我的錯誤。提前致謝。重複使用ExtJs中的相同組件

Dashboard.NotificationPanel = Ext.extend(Ext.grid.GridPanel, { 
    columns: [...], 
    view: new Ext.grid.GridView({ 
     forceFit: true, 
     enableRowBody: true, 
     ignoreAdd: true, 
     emptyText: 'No Notifications to display' 
    }), 
    initComponent: function() { 
     var store = new Ext.data.Store({ 
      url: '...', 
      autoLoad: true, 
      reader: new Ext.data.XmlReader({ 
       record: 'result', 
       id: 'id' 
      }, ['c_case_number', 'c_creator', 'c_date_created', 'c_notification_condition', 'c_message']) 
     }); 
     var config = { 
      store: store, 
      bbar: new Ext.PagingToolbar({ 
       pageSize: 10, 
       store: store, 
       displayInfo: true, 
       displayMsg: 'Displaying notifications {0} - {1} of {2}', 
       emptyMsg: "No Notifications to display" 
      }) 
     } 
     Ext.apply(this, Ext.apply(this.initialConfig, config)); 

     Dashboard.NotificationPanel.superclass.initComponent.call(this); 

    } 

}); 

回答

3

它不與兩個實例一起工作的原因是視圖和列正在應用於原型而不是實際的網格實例。它們本質上是在所有不期望行爲的實例之間共享的。除非需要共享行爲,否則不要在原型上放置非原始對象。做這樣的事情,而不是:

Dashboard.NotificationPanel = Ext.extend(Ext.grid.GridPanel, { 
initComponent : function() { 
    var store = new Ext.data.Store({ 
     url : '...', 
     autoLoad : true, 
     reader : new Ext.data.XmlReader({ 
        record : 'result', 
        id : 'id' 
       }, ['c_case_number', 'c_creator', 'c_date_created', 
         'c_notification_condition', 'c_message']) 
    }); 
    var config = { 
     columns : [...], 
     view : new Ext.grid.GridView({ 
      forceFit : true, 
      enableRowBody : true, 
      ignoreAdd : true, 
      emptyText : 'No Notifications to display' 
     }), 
     store : store, 
     bbar : new Ext.PagingToolbar({ 
        pageSize : 10, 
        store : store, 
        displayInfo : true, 
        displayMsg : 'Displaying notifications {0} - {1} of {2}', 
        emptyMsg : "No Notifications to display" 
       }) 
    } 
    Ext.apply(this, Ext.apply(this.initialConfig, config)); 

    Dashboard.NotificationPanel.superclass.initComponent.call(this); 

} 
}); 

而且

Ext.apply(this, Ext.apply(this.initialConfig, config)) 

在擴展3冗餘代碼,而不是使用:

Ext.apply(this, config) 
+1

額外提示:作爲一個經驗法則,只能使用簡單數據類型(數字,字符串,布爾值)或作爲「Ext.extend」的第二個參數的成員。 – user123444555621 2012-04-07 07:46:02

+0

感謝pllee,你的回答很有幫助。我很感激你花時間回答我的問題。 – Skoffer 2012-04-09 06:44:03

+0

嘿Pumbaa80,你是什麼意思? – Skoffer 2012-04-09 06:45:23

相關問題