Question

我使用ExtJS版本是4.2。我试图保存网格的状态，这是一个窗口的项目。当我关闭窗口时，网格的状态保存在cookie中，但是当窗口再次打开时它不会被恢复。我错过了什么？

这是我的代码：

git checkout .

这是小提琴：https://fiddle.sencha.com/#view/editor&fiddle/20sf

Answer 1

在每个按钮上单击，您创建一个全新网格的新窗口，看起来似乎相同，但状态管理器绝对是另一个网格。您可以通过在ComponentManager中记录网格组件并在每次单击按钮时看到不同的网格ID来检查：

console.log(Ext.ComponentQuery.query('grid'));

为了解决您的问题，我建议您：

在按钮点击
通过设置将关闭行为的窗口从destroy更改为hide closeAction参数为'hide'
使您的窗口组件模态，以防止用户点击其他按钮直到窗户关闭。

您可能会在下面找到更正的小提琴here和代码：

Ext.onReady(function () {
    Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

    var store = Ext.create('Ext.data.Store', {
        storeId: 'simpsonsStore',
        fields: ['name', 'email', 'phone'],
        data: {
            'items': [{
                'name': 'Lisa',
                "email": "lisa@simpsons.com",
                "phone": "555-111-1224"
            }, {
                'name': 'Bart',
                "email": "bart@simpsons.com",
                "phone": "555-222-1234"
            }, {
                'name': 'Homer',
                "email": "home@simpsons.com",
                "phone": "555-222-1244"
            }, {
                'name': 'Marge',
                "email": "marge@simpsons.com",
                "phone": "555-222-1254"
            }]
        },
        proxy: {
            type: 'memory',
            reader: {
                type: 'json',
                root: 'items'
            }
        }
    });

    var grid = Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: store,
        columns: [{
            text: 'Name',
            dataIndex: 'name'
        }, {
            text: 'Email',
            dataIndex: 'email',
            flex: 1
        }, {
            text: 'Phone',
            dataIndex: 'phone'
        }],

        stateful: true,
        stateId: 'some_state_id'
    });

    var win = Ext.create('Ext.window.Window', {
        title: 'Hello',
        height: 200,
        width: 400,
        modal: true,
        layout: 'fit',
        closeAction: 'hide',
        items: grid
    });

    Ext.create('Ext.container.Viewport', {
        items: [
            Ext.create('Ext.Button', {
                text: 'Click me',
                listeners: {
                    'click': function () {
                        // console.log(Ext.ComponentQuery.query('grid'));
                        win.show();
                    }
                }
            })
        ]
    });
})

Extjs 4.2网格状态不会在Ext.window.Window视图中恢复

1 个答案: