如何在不影响其存储的情况下销毁 ExtJS 网格？答案

【问题标题】：How do I destroy an ExtJS grid without affecting its store?如何在不影响其存储的情况下销毁 ExtJS 网格？
【发布时间】：2010-02-24 04:55:51
【问题描述】：

我有一个这样的 ExtJS 商店：

var dataStore = new Ext.data.JsonStore({...});

我在工厂中使用它来获取 GridPanel：

function CreateGrid(config) {
    return new Ext.grid.GridPanel({
        store: dataStore,
        ...
    })
};

现在，当我运行这段代码时：

new Ext.Window({
    closable: true,
    items: CreateGrid(),
}).show();

我第一次运行它时，网格工作正常。但是，如果我关闭窗口并重新打开另一个窗口，则无法再对列进行排序，也无法刷新商店。

我已将问题归结为商店，以及当网格被破坏时发生的任何事情。如果我将 CreateGrid() 函数改为：

function CreateGrid(config) {
    return new Ext.grid.GridPanel({
        store: new Ext.data.JsonStore({...}),
        ...
    }
};

它工作得很好，除了我每次都得到一个新商店而不是重复使用旧商店。

如何解决这个问题，以便我可以在不破坏商店的情况下破坏网格？这背后的想法是我想保留商店以保留列排序和过滤，但破坏网格以节省内存。

【问题讨论】：

【解决方案1】：

我知道这已经很晚了，但是我一直在 ExtJS 4（3 也是）中破坏网格并且保留了存储。

我发现，如果你给商店一个 storeId 值，它会被保留（在 ExtJS 3 中它会持续到 DOM 被清除或 Ext.StoreMgr.lookup(storeId).destory() 被调用）。

【讨论】：

【解决方案2】：

您没有指定关闭窗口的方式（通过调用 close 方法，或从 UI 关闭窗口），但也许您应该隐藏它？引用 ExtJS 文档：

默认情况下，关闭标题工具破坏 Window 导致销毁任何子组件。这使得 Window 对象和所有它的后代无法使用。启用重用一个Window，使用closeAction： '隐藏'。

关于 closeAction 配置选项：

此设置不影响关闭总是会破坏的方法窗户。以编程方式隐藏窗口，调用隐藏。

【讨论】：

糟糕，我使用Window 只是作为测试问题的简单方法。 GridPanel实际上在另一个Panel中，而我正在使用Panel.remove()来删除网格。

【解决方案3】：

在您的商店中，设置autoDestroy: false。

【讨论】：

【解决方案4】：

这背后的想法是我想保留商店以保留列排序和过滤，但破坏网格以节省内存。

列排序和过滤是在GridPanel 对象还是Store 对象上保留的？如果不深入研究 src 代码，我不确定。这可能是你的问题。也许您可以在 cookie 中实现“记住”排序/过滤器（请参阅Ext.state.Manager）。

您也可以尝试只隐藏网格而不是删除它，正如 Tommi 所建议的那样。如果你只有这一个网格，内存使用应该不会太差。

最后一件事要尝试：在您的工厂 fn 中，创建网格，然后使用 grid.store = dataStore;

将商店附加到它

【讨论】：

【解决方案5】：

我发现了问题所在。 Livegrid 扩展存在一个错误，该错误会在网格关闭时弄乱底层的特定于 livegrid 的存储。

【讨论】：