ExtJS4：創建在initComponent中的存儲在表單面板中未定義

在回到ExtJS4文檔並在他們的示例行中複製行以嘗試排除我可能出錯的位置時，我很難過。嗅探initComponent處於不幸的操作順序問題。ExtJS4：創建在initComponent中的存儲在表單面板中未定義

正在定義的商店是1）沒有填充字段，2）在試圖從字段監聽器調用它之後被認爲是未定義的。

我定義一個存儲這樣在initComponent，

Ext.define('X.view.NewLogWindow', { 
extend: 'Ext.window.Window', 
xtype:'newlogwindow', 
itemId: 'newLogWindow', 
width: 300, 
height: 140, 
modal: true, 
title: 'Create Log', 
layout: 'fit', 
initComponent: function() { 

    this.monthStore = Ext.create('Ext.data.Store', { 
     fields : [ 
      {name : 'id', type : 'int'}, {name : 'month', type : 'string'} 
     ], 
     autoLoad: true, 
     data : [ 
      {"id" : 0, "month" : "January"}, 
      {"id" : 1, "month" : "February"}, 
      {"id" : 2, "month" : "March"}, 
      {"id" : 3, "month" : "April"}, 
      {"id" : 4, "month" : "May"}, 
      {"id" : 5, "month" : "June"}, 
      {"id" : 6, "month" : "July"}, 
      {"id" : 7, "month" : "August"}, 
      {"id" : 8, "month" : "September"}, 
      {"id" : 9, "month" : "October"}, 
      {"id" : 10, "month" : "November"}, 
      {"id" : 11, "month" : "December"} 
     ] 
    }); 

    var x = 'fixme'; 

    console.log(this.monthStore); 
    console.log(x); 


    this.callParent(); 


}

然後，我分配存儲到該組合框的形式面板這樣：

items: [ 
    { 
     xtype: 'form', 
     margin: 10, 
     border: false, 
     defaults: {allowBlank: false}, 
     items: [ 
      { 
       xtype: 'combobox', 
       fieldLabel: 'Log Month', 
       store: this.monthStore, 
       queryMode : 'local', 
       displayField: 'month', 
       valueField: 'id', 
       listeners: {blur: function(field) 
       { 
        console.log(this.monthStore); 
        console.log(this.x); 
        } 

       } 
      } 
     ] 
    } 
]

下面是從輸出我的控制檯日誌記錄：

constructor NewLogWindow.js:40 
fixme NewLogWindow.js:41 
undefined NewLogWindow.js:74 
undefined NewLogWindow.js:75

在此先感謝。

來源

2012-05-21 John

缺點是「將其添加到表單面板」。怎麼樣？窗口與這種形式有什麼關係？ –

只需使用storeId配置，所以你會對商店手柄，例如：

initComponent: function() { 

    Ext.create('Ext.data.Store', { 
     storeId: 'months', 
     fields : [ 
      {name : 'id', type : 'int'}, {name : 'month', type : 'string'} 
     ], 
     autoLoad: true, 
     data : [ 
      {"id" : 0, "month" : "January"}, 
      {"id" : 1, "month" : "February"}, 
      {"id" : 2, "month" : "March"}, 
      {"id" : 3, "month" : "April"}, 
      {"id" : 4, "month" : "May"}, 
      {"id" : 5, "month" : "June"}, 
      {"id" : 6, "month" : "July"}, 
      {"id" : 7, "month" : "August"}, 
      {"id" : 8, "month" : "September"}, 
      {"id" : 9, "month" : "October"}, 
      {"id" : 10, "month" : "November"}, 
      {"id" : 11, "month" : "December"} 
     ] 
    }); 

// etc...

然後你可以使用store: Ext.StoreManager.lookup('months')到您想要進行分配。

還意識到initComponent在組件中的靜態數據已被處理後調用。我無法確定您正在運行上面第二個代碼塊的位置。但是您必須創建該組合才能在創建商店後使用在initComponent中創建的商店，即在調用initComponent之後。你可以做這樣的事情在initComponent您創建存儲之後：

this.items = [{ 
    xtype: 'form', 
    margin: 10, 
    border: false, 
    defaults: {allowBlank: false}, 
    items: [{ 
     xtype: 'combobox', 
     fieldLabel: 'Log Month', 
     store: Ext.StoreManager.lookup('months'), 
     queryMode : 'local', 
     displayField: 'month', 
     valueField: 'id', 
     listeners: { 
      blur: function(field) { 
       console.log(this.monthStore); 
       console.log(this.x); 
      } 
     } 
    }] 
}];

，如果我有一個參考商店，可以通過多個視圖得到使用我做的另一件事是在控制器中創建它。然後當我創建一個視圖的實例時，我已經有了它，我可以做上面顯示的StoreManager.lookup調用。

來源

2012-05-22 01:57:05 Geronimo

你正在努力的是「這個」上下文的範圍。在控制檯輸出上放置一個斷點並檢查「this」對象。它會讓你走上正確的道路。

來源

2012-05-21 22:27:31 dbrin

ExtJS4：創建在initComponent中的存儲在表單面板中未定義

回答

相關問題