ExtJS 4 即时更改网格存储答案

【问题标题】：ExtJS 4 Change grid store on the flyExtJS 4 即时更改网格存储
【发布时间】：2011-08-18 13:18:21
【问题描述】：

是否可以在 ExtJS 4 中更改网格的存储？

例如，我有两个模型：

User = Ext.define('User',{
  extend: 'Ext.data.Model',
  [...],
  hasMany: 'Product'
});

Product = Ext.define('Product',{
  extend: 'Ext.data.Model',
  [...]
});

和两个网格。第一个网格与使用 User 模型并从后端加载嵌套 json 数据的 Store 链接，例如

{
  users: [{
     id: 1,
     products: [
       {id: 1},
       {id: 2}
     ]
  }, {
     id: 2,
     products: [
       {id: 3},
       {id: 4},
       {id: 5}
     ]
  }]
}

我想要得到的是当您单击第一个网格中的行时，第二个网格必须显示用户的产品，而无需连接到服务器。我所知道的是user.products(); 返回一个Ext.data.Store 对象。所以想法是将第二个网格的存储更改为user.products();，但是没有grid.setStore()这样的方法:-)

提前致谢

【问题讨论】：

标签： extjs grid extjs4

【解决方案1】：

我认为更好的解决方案是：

     grid1.on('itemclick', function(view, record) {
         grid2.reconfigure(record.products());
     );

【讨论】：

reconfigure 不仅仅是重新绑定商店。如果一个人有两个相同结构的存储，但只想更改网格的后备存储，则需要通过调用getView 获取存储的Ext.grid.View，并使用新存储调用bindStore 方法。
@jMerliN 我建议不要这样做，因为它违反了 api，您可能会看到一些奇怪的错误。当grid.getStore() != grid.getView().store 我没有运行用例但grid.store.load() 不会触发视图刷新时，我可以看到一个潜在的问题。 reconfigure 旨在允许网格更改存储并且没有太多开销。

【解决方案2】：

您以错误的方式查看商店。商店永远连接到网格，因此没有grid.setStore()。您不会更改网格的存储，而是更改该网格的存储中的 DATA。

现在，您的问题的解决方案：您的部分是正确的，您已经拥有一个包含您的数据的存储实例。 IE; user.products()。尽管如此，您仍必须为您的网格创建一个商店。不过，这家商店不会有任何数据。现在，当您需要显示产品信息时，您需要使用数据加载网格的商店。您可以使用：

加载（）
加载数据（）
加载记录（）

将数据加载到您的商店。在您的情况下，您可以执行以下操作：

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange(0,myStore.getCount()),{addRecords: false});

【讨论】：

非常感谢，这正是我需要的
在网格上更改存储是很常见的。 grid.reconfigure 可用于更改存储或列模型。另外 addRecords 默认为“false”。

【解决方案3】：

如果要在创建网格后将商店附加到网格，可以使用bindStore() 方法。

var store = user.products();
grid.getView().bindStore(store);

您也可以使用 load()、loadData()、loadRecords() 方法，并将数据复制到您的存储中。

【讨论】：

【解决方案4】：

当我需要更新没有 reconfigure（继承自 Ext.form.FieldSet 的自定义类）的数据时，Abdel Olakara 的回答帮助了我。

但是您不需要指定addRecords 或getRange 的范围，因为在这种情况下我们已经涵盖了默认值。

这意味着你可以这样做：

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange());

【讨论】：