extjs - 状态提供者没有正确恢复排序器

Question

我正在尝试使用 Ext.state.CookieProvider 存储我的网格状态。问题是当状态本身(宽度、顺序)正在正确恢复时我无法恢复排序器参数。

首先，我在视口(viewport) View Controller 的 init() 方法中创建了 cookieprovider:

Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider', {}));

我的商店设置为使用远程排序自动加载:

Ext.define('MyApp.requests.store.QueryRequestsGridStore', {
    extend: 'Ext.data.Store',
    model: 'MyApp.requests.model.QueryRequestsGridModel',
    alias: 'store.queryRequestsGrid',
   remoteSort: true,
    autoLoad: true,
    proxy: {
        startParam: 'offset',
        limitParam: 'limit',
        url: '/requests',
        noCache: false,
        type: 'ajax',
        reader: {
            type: 'json',
            rootProperty: 'data',
            totalProperty: 'total'
        }
    },
});

商店是使用 View 模型绑定(bind)在网格中定义的:

bind: {
    store: '{queryRequestsGrid}'
},

我在单击按钮时从视口(viewport) View Controller 加载包含商店的网格，如下所示:

var panelToAddName = Ext.create('MyApp.requests.view.QueryRequestsGridView', {});
var mainViewPort = Ext.ComponentQuery.query('#mainViewPort')[0];
var regionPanel = mainViewPort.down('[region=center][xtype=panel]');
regionPanel.removeAll();
regionPanel.add(panel);

Cookie 包含排序器，但加载网格时没有任何排序参数。

"storeState":{"sorters":[{"root":"data","property":"date_completed","direction":"ASC"}]}}}

我深入研究了 ext-all-debug.js 源文件并找到了“Ext.state.Stateful”类的 initState() 方法。

initState: function() {
        var me = this,
            id = me.stateful && me.getStateId(),
            hasListeners = me.hasListeners,
            state, combinedState, i, len, plugins, plugin, pluginType;
        if (id) {
            combinedState = Ext.state.Manager.get(id);
            if (combinedState) {
                state = Ext.apply({}, combinedState);
                if (!hasListeners.beforestaterestore || me.fireEvent('beforestaterestore', me, combinedState) !== false) {

                    plugins = me.getPlugins() || [];
                    for (i = 0 , len = plugins.length; i < len; i++) {
                        plugin = plugins[i];
                        if (plugin) {
                            pluginType = plugin.ptype;
                            if (plugin.applyState) {
                                plugin.applyState(state[pluginType], combinedState);
                            }
                            delete state[pluginType];
                        }
                    }

                    me.applyState(state);
                    if (hasListeners.staterestore) {
                        me.fireEvent('staterestore', me, combinedState);
                    }
                }
            }
        }
    },

如果从该方法内部记录 me.store，商店在控制台中显示为 ext-empty-store 而 me 是我加载的网格。似乎状态在正确加载商店之前正在应用。

如果在 beforerender 网格事件中重用 initState 方法，排序器将从 cookie 中正确恢复。

有什么建议吗？

Answer 1

我还没有将 viewmodel 绑定(bind)作为存储和网格之间的唯一绑定(bind)，并且无法评论它是否应该有效，或者只是偶然。

但是我知道 viewmodel 处理的很晚，因为必须先完全初始化 view(包括 applyState)，这样 viewmodel 才能找到它想要绑定(bind)监听器的所有组件.

因此，请尝试使用即使没有 View 模型也能工作的两种“老式”方法中的任何一种来添加商店:store:'MyStoreId' 或 store:Ext.create( 'MyApp.store.MyStore') 在网格上。这样，商店应该在 applyState 之前绑定(bind)到网格。

此外，我看到另一个您应该解决的问题:您的商店在商店初始化后直接加载。 (自动加载:真)。那时，它还没有绑定(bind)到网格；因此，没有应用排序/过滤器，这意味着在启用 remoteSort/remoteFilter 的情况下，您向服务器发送了太多请求。我建议仅在商店应用于网格后才加载商店(在 callParent 调用后的 grid.initComponent 中，或来自 grid.boxready 监听器)。如果您真的想使用 autoLoad，我建议您查看 setAutoLoad方法