如何調用Extjs商店而不創建它的明確實例

我有一個應用程序，它的第一個頁面與不同的組件構建。我在頁面加載（main.js）創建一個userStore實例我想訪問userStore在我的標題中獲取用戶的名字並將其顯示在標題部分。如何調用Extjs商店而不創建它的明確實例

Ext.create('store.User', { 
    storeId : 'storeUser' 
}); 
    Ext.define('OnlineApp.view.Main', { 
    extend  : 'Ext.panel.Panel', 
    xtype  : 'app-main', 
    requires : [ 
     'Ext.plugin.Viewport' 

    ], 
    controller : 'main', 
    viewModel : 'main', 
    layout  : 'border', 
    padding  : '0 0 0 0', 
    bodyStyle : 'border:0', 
    items  : [ 
     { 
      xtype : 'appHeader', 
      region : 'north' 
     }, 
     { 
      xtype  : 'tabpanel', 
      region  : 'center', 
      bodyPadding : 0, 
      id   : 'contentPanel', 
      reference : 'contentPanel', 
      layout  : 'card', 
      border  : false, 
      scrollable : true, 
      tabBar  : { 
       hidden : true 
      }, 
      items  : [ 
       firstPage, 
       contentFrame, 

      ], 

     }, 

     { 
      xtype : 'footer', 
      region : 'south' 
     } 
     ] 
    }); 

** This is a Header file where I am trying to use the store below. Not sure what could be the best way to call store without creating a instance.** 

     Ext.define('OnlineApp.view.Header', { 
    extend: 'Ext.container.Container', 
    xtype : 'appHeader', 
    id  : 'main-header', 

    height : 100, 

    layout : { 
     type : 'hbox', 
     align : 'middle' 
    }, 
    initComponent: function() { 

     this.items = [ 

      { 
       xtype : 'container', 
       flex : .55, 
       layout : { 
        type: 'vbox', 
        align : 'right' 
       }, 
       collapsible : false, 
       padding : 5, 
       items : [ 
        { 
         xtype : 'container', 
         id  : 'app-header-user', 
         ui  : 'usp-plain-button', 
         layout : { 
          type : 'hbox', 
          align : 'center' 
         }, 
         items : [ 
          { 
           xtype : 'component', 
           html : 'Welcome, <b>' + Ext.getStore('storeUser').data.firstname + '</b>' **// I am trying to use the store getting fiest name as undefined.** 
          }, 
          { 
           xtype : 'gear-menu' 
          } 
         ] 
        }, 

      } 
     ]; 
      this.callParent(); 
     } 
    });

來源

2016-09-20 divein

如果我們假設您已正確生成/定義存儲。某處有Ext.define('store.User')。否則，您應該使用Ext.create('Ext.data.Store',{storeId: 'storeUser'});

因此Ext.getStore('storeUser')正在您的標題視圖中返回存儲對象。你不能只使用data.firstname就可以了。因爲商店中的data property是Ext.util.Collection。

如果你想從你的存儲數據，你應該使用：

Ext.getStore('storeUser').getAt(0).get('firstname')

其中0是在您的商店的記錄的索引。

順便說一句你的情況我會建議你使用Ext.Temaples你可以檢查官方example here。或者here在stackoverflow上是非常好的例子。

來源

2016-09-20 22:24:27 pagep

在這種情況下，您的商店肯定有問題。你可以添加關於你的商店的代碼嗎？因爲在示例代碼中您的商店是空的。 – pagep

是的，我有一個正確定義的商店。我嘗試使用Ext.getStore（'storeUser'）。getAt（0）.get（'firstname'），我碰到一個錯誤「Can not read property'get'of null」但是創建顯式實例我得到它的工作。我會嘗試模板建議。 Ext.create（'store.User'）。load（{scope：this，callback：function（records，operation，success））{} {var headerObj = this.items.items [1] .items.items [0]。 items.items [0]; headerObj .setHtml（'Welcome，'+ records [0] .data.firstname +''）;}}）; – divein

Ext.define（ 'OnlineApp.store.User'，{ 延伸\t \t： 'Ext.data.Store'，別名\t \t： 'store.User'，模型\t \t： 'OnlineApp.model.User' ， autoLoad \t：true }）; – divein

如何調用Extjs商店而不創建它的明確實例

回答

相關問題