在 ExtJS 4 中多次使用相同视图和存储的最佳实践

Question

我想在 ExtJS 应用程序中同时拥有具有不同商店的同一视图的不同实例。目前我在视口中创建了同一视图（Ext.view.View）的多个实例。

但是，在每个视图中都有不同的商店的最佳做法是什么？我发现的每个示例都在使用控制器的 stores-Config 创建的视图中使用 Store-ID。但这会为每个视图使用同一个商店。

目前我想出了以下可能的解决方案：

1. 为每个视图实例创建一个自己的商店类。将所有商店添加到控制器并为每个视图实例使用不同的商店 ID。
2. 根本不使用控制器的存储，并在视图的 initComponent 中创建一个新的存储，手动将不同的参数传递给存储的每个实例。
3. 根本不要使用控制器的存储，并在视图的 initComponent 中手动创建一个新存储。然后使用 load 手动加载商店，为商店的每个实例使用不同的参数。

这些解决方案中的任何一个是最佳实践还是应该以不同的方式完成？

Answer 1

控制器的stores数组的东西 也就是说，它将覆盖任何定义的storeId。加载 store 类后，控制器通过命名空间约定设置 storeId，创建 store 并使用 soreId 的值创建 getter 方法方法。

让我介绍选项 4

• 为视图定义一个存储并在视图中使用它（您也可以在控制器中使用它，只需使用requires 数组）。
• 为视图选择有效的itemId，为您的商店选择有效的storeId，这应该取决于视图的itemId（在创建视图时设置它！）。
• 在initComponent 中创建storeId 并在StoreManager 中查找商店。如果它不存在，则创建它并提供客户配置和storeId。

如果您每次都需要销毁视图和存储，请查看this post

演示初始化组件

initComponent: function() {
    var me = this,
        storeId = me.storeId + me.itemId;
    me.store = Ext.StoreManager.lookup(storeId);
    if(me.store === null)
        me.store = Ext.create('App.data.CustomViewStore',Ext.apply({storeId: storeId},me.storeCfg || {}));
    me.callParent(arguments);
}

注意：如果您使用 views 数组加载视图，您最终会得到一个可能无法为您提供预期视图的 getter。您也可以在这里使用控制器的 requires 数组。如果您想使用 getter，只需使用 refs 配置创建您自己的。