extjs - Ext Js App 臃肿的商店

Question

我的应用程序（Ext JS 4.2.1）包含许多网格面板，以及许多商店。定义商店时，我使用 storeId 来匹配网格和商店。其中许多商店几乎完全相同。示例商店如下所示

Ext.define('MyApp.store.UsersStore', {
     model: 'MyApp.model.User',
     storeId: 'UsersStore',
     proxy: {
         type: 'rest',
         url: 'somePrefix/users',
         reader: { 
             type: 'json', 
             totalProperty: 'total', 
             root: 'users'            
         } 
     }
});

另一个商店“AvailableUsersStore”看起来很相似，它只是使用另一个 url，“somePrefix/users/?Available”和另一个 storeId，“AvailableUsersStore”。所以我的应用程序中有很多非常冗余的代码行，分布在许多商店文件中。知道如何清理这个吗？

Answer 1

为您的商店创建基类：

Ext.define('MyApp.store.UsersStore', {
     extend: 'Ext.data.Store',
     model: 'MyApp.model.User',
     proxy: {
         type: 'rest',
         url: 'somePrefix2/users1',
         reader: { 
             type: 'json', 
             totalProperty: 'total', 
             root: 'users'            
         } 
     }
});

然后扩展你的基类：

Ext.define('MyApp.store.AvailableUsersStore', {
     extend: 'MyApp.store.UsersStore',
     storeId: 'userStore1',
     proxy: {
         url: 'somePrefix2/users2',
     }
});

Ext.define('MyApp.store.RemovedUsersStore', {
     extend: 'MyApp.store.UsersStore',
     storeId: 'userStore2',
     proxy: {
         url: 'somePrefix2/users3',
     }
});

看看这里的类扩展。还可以查看Deft.js以了解 extjs 中的灵活架构。