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

I have an ExtJS store like so:

我有一个像这样的ExtJS商店：

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

I'm using it with a factory to get a GridPanel:

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

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

Now, when I run this code:

现在，当我运行此代码时：

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

The first time I run it, the grid works fine. However, if I close the window and re-open another one, I can't sort the columns anymore, nor refresh the store.

我第一次运行它，网格工作正常。但是，如果我关闭窗口并重新打开另一个窗口，我就不能再对列进行排序，也不能刷新存储。

I've pinpointed the issue down to the store, and whatever is happening to it when the grid is destroyed. If I change my CreateGrid() function to this instead:

我已经将问题确定到了商店，以及当网格被破坏时发生的任何事情。如果我改为将CreateGrid（）函数更改为：

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

It works perfectly fine, except I'm getting a new store each time instead of re-using the old one.

它工作得非常好，除了我每次都有新商店而不是重新使用旧商店。

How do I fix this problem so that I can destroy the grid without messing up the store? The thought behind this is that I want to keep the store around in order to preserve the column sorting and filtering, but destroy the grid in order to save on memory.

我如何解决这个问题，以便我可以破坏网格而不会弄乱商店？这背后的想法是我想保留商店以保留列排序和过滤，但是为了节省内存而销毁网格。

5 个解决方案

#1

I know this is way late, but I destroy grids all the time in ExtJS 4 (3 too) and the stores are preserved.

我知道这已经晚了，但是我在ExtJS 4中也一直摧毁网格（也是3）并且商店被保留了下来。

What I have found is that if you give a store a storeId value, it is preserved (in ExtJS 3 it lasts until the DOM is cleared or Ext.StoreMgr.lookup( storeId ).destory() is called).

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

#2

You do not specify how you close the window (by calling the close method, or closing the window from UI), but perhaps you should hide it instead? Quoting ExtJS documentation:

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

By default, the close header tool destroys the Window resulting in destruction of any child Components. This makes the Window object, and all its descendants unusable. To enable re-use of a Window, use closeAction: 'hide'.

默认情况下，close标头工具会破坏Window，从而导致销毁任何子组件。这使得Window对象及其所有后代都无法使用。要启用Window的重用，请使用closeAction：'hide'。

And about the closeAction config option specifically:

关于closeAction配置选项具体：

This setting does not affect the close method which will always destroy the window. To programatically hide a window, call hide.

此设置不会影响将始终销毁窗口的close方法。要以编程方式隐藏窗口，请调用hide。

#3

In your store, set autoDestroy: false.

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

#4

The thought behind this is that I want to keep the store around in order to preserve the column sorting and filtering, but destroy the grid in order to save on memory.

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

Is column sorting and filtering kept intrnally on the GridPanel object, or on the Store object? I'm not sure without digging into the src code. This might be your issue. Maybe you can achieve "remembering" the sort/filter in a cookie (see Ext.state.Manager).

列排序和过滤是否内部保留在GridPanel对象或Store对象上？我不确定没有深入研究src代码。这可能是你的问题。也许你可以在cookie中“记住”排序/过滤器（参见Ext.state.Manager）。

You can also try just hiding the grid instead of removing it, as suggested by Tommi. If you only have this one grid, memory usage shouldn't be too bad.

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

One last thing to try: in your factory fn, create the grid and then attach the store to it using grid.store = dataStore;

最后一件事：在你的工厂fn中，创建网格，然后使用grid.store = dataStore将商店附加到它;

#5

I found out what the problem is. There's a bug with the Livegrid extension that messes up the underlying livegrid-specific store when the grid is closed.

我发现了问题所在。 Livegrid扩展中存在一个错误，当网格关闭时，它会混淆底层的livegrid特定存储。

#1