Question

所以我有panel（我们称之为fooPanel），其中包含grid（如果fooGrid，请调用，其中有一些store）。 fooPanel可以插入某些tabpanel。所以问题在于，tabpanel可能包含fooPanel的两个（或更多）实例，并带有一些不同的参数。我认为这个问题很明显。由于正在使用该面板的fooGrids具有相同的stores，因此只要我重新加载一个商店，就会重新加载fooGrids。（因为他们有相同的stores）。这个问题有方法解决吗？或者我应该限制用户只打开fooPanel每个tabpanel

的一个实例

Answer 1

除了每个网格创建一个商店外，没有简单的解决方案如果你不想创建多个商店实例的原因是为了避免多次加载，你可以在代理级别破解某种缓存。

修改如何为网格创建多个商店的示例

您可以在网格的Ext.create('My.Store')方法中自行创建商店实例（即使用initComponent）：

Ext.define('My.Store', {
    extend: 'Ext.data.Store'
    ,fields: ['name']
    ,proxy: {
        type: 'memory'
        ,reader: 'array'
    }
    ,data: [['Foo'],['Bar'],['Baz']]
});

Ext.define('My.Grid', {
    extend: 'Ext.grid.Panel'

    ,columns: [{dataIndex: 'name'}]

    ,initComponent: function() {
        // /!\ Do that BEFORE calling parent method
        if (!this.store) {
            this.store = Ext.create('My.Store');
        }

        // ... but don't forget to call parent method            
        this.callParent(arguments);
    }
});

// Then I can create multiple grids, they will have their own store instances

Ext.create('My.Grid', {
    renderTo: Ext.getBody()
    ,height: 200
});

Ext.create('My.Grid', {
    renderTo: Ext.getBody()
    ,height: 200
});

或者您可以在创建时指定新的商店实例：

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody()
    ,height: 200
    ,columns: [{dataIndex: 'name'}]
    ,store: Ext.create('My.Store') // one instance
});

Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody()
    ,height: 200
    ,columns: [{dataIndex: 'name'}]
    ,store: Ext.create('My.Store') // two instances!
});

但是，就我而言，我通常不打扰创建完整的商店定义。我在模型中配置代理，并使用该模型使用内联存储配置（内联配置将在Ext4中转换为它们自己的实例）。例如：

Ext.define('My.Grid', {
    extend: 'Ext.grid.Panel'

    ,columns: [{dataIndex: 'name'}]

    // inline store configuration
    ,store: {
        // The model takes care of the fields & proxy definition
        model: 'My.Model'

        // other params (like remoteSort, etc.)
    }
});

// Now I can create plenty of My.Grid again, that won't interfere with each other

Answer 2

在ExtJS 5中，您可以利用链式商店。这样，您就可以拥有一个源存储，以及其他商店使用不同的过滤器查看同一个商店。

http://docs.sencha.com/extjs/5.0.0/whats_new/5.0/whats_new.html

http://extjs.eu/on-chained-stores/

Answer 3

这篇文章可能对您有所帮助

Ext.define('App.store.MyStore', {
    extend : 'Ext.data.Store',
    alias  : 'store.app-mystore', // create store alias

    // ... 
}); 

Ext.define('App.view.MyCombo', {
    extend : 'Ext.form.field.ComboBox',
    xtype  : 'app-mycombo',

   requires : [
       'App.store.myStore'
   ],

   // combo config
   store : {
       type : 'app-mystore' // store alias; type creates new instance
   }
});

http://www.sencha.com/forum/showthread.php?284388-ExtJs-4.2-Multiple-instances-of-the-same-Store&p=1040251

具有相同存储Ext JS的网格问题

3 个答案: