Ext JS：如何批量重载多个Store？

嘿，我来帮你搞定这个批量重载Store的问题！你现在遇到的问题根源很明确：Ext.getStore()方法只接受单个Store ID作为参数，你传多个ID的话，它只会返回第一个匹配的Store，所以才只有sampleStore1被重载了。

下面给你几种实用的解决方案，你可以根据自己的场景选择：

方案一：直接遍历Store ID数组 #

这是最直观的写法，把需要重载的Store ID放进数组，然后逐个获取并调用reload()：

refreshPanel: function () {
    // 把目标Store的ID都放进数组里
    var targetStoreIds = ['sampleStore1', 'sampleStore2', 'sampleStore3'];
    
    // 遍历数组，逐个处理每个Store
    targetStoreIds.forEach(function(storeId) {
        var store = Ext.getStore(storeId);
        // 先判断Store是否存在，避免找不到Store时报错
        if (store) {
            store.reload();
        }
    });
}

方案二：封装复用的批量重载方法 #

如果你的项目里经常需要批量重载Store，可以把逻辑封装成一个可复用的方法，以后直接调用就行：

// 可以把这个方法放在ViewModel或者全局工具类里
batchReloadStores: function(storeIdList) {
    storeIdList.forEach(function(storeId) {
        var store = Ext.getStore(storeId);
        // 用短路判断简化代码，只有Store存在时才执行reload
        store && store.reload();
    });
}

// 然后在refreshPanel里调用这个方法
refreshPanel: function () {
    this.batchReloadStores(['sampleStore1', 'sampleStore2', 'sampleStore3']);
}

方案三：从ViewModel直接获取Store（推荐MVVM模式） #

如果这些Store是你在ViewModel里定义的，那更推荐直接从ViewModel获取，不用依赖全局的Ext.getStore()，更符合ExtJS的MVVM设计：

refreshPanel: function () {
    var viewModel = this.getViewModel();
    // 这里的名称要和你ViewModel里定义的Store名称一致
    var storeNames = ['sampleStore1', 'sampleStore2', 'sampleStore3'];
    
    storeNames.forEach(function(storeName) {
        var store = viewModel.getStore(storeName);
        if (store) {
            store.reload();
        }
    });
}

这些方案都能实现你想要的“一次调用逻辑，批量重载所有目标Store”的需求，而且避免了创建多个变量的冗余代码。

内容的提问来源于stack exchange，提问作者Nuri Engin