Extjs 在多次使用实例时，未保存网格状态

如果我有一个以上的网格实例，我会遇到很多问题。一个问题是状态保存（即排序、过滤器宽度等）不能正常工作。当我导航到同一网格的另一个实例时，状态的保存被重置。但是，如果我在只有一个网格的页面上，我可以单击“刷新”，并更改有关的内容，所有内容都保存为OK。它只是当我导航到一个屏幕与我的网格的另一个实例

是的，我正在为这两个实例设置不同的stateId，并且在应用程序开始时调用Ext.state.Manager：

Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

创建实例的过程如下所示：

this.packageGrid = Ext.create('js.grid.PackageGrid', {
    stateId: 'CompletePackageGrid', //for my other instance I obviously use a different string here
    width: 979,
    height: 400,

});

Ext.define('js.grid.PackageStore', {
    extend: 'Ext.data.JsonStore',
    model: 'js.model.Package',
    remoteFilter : false,
    remoteSort: false
});


var createColumns = function () {

    var columns = [{
        dataIndex: 'id',
        text: 'ID',
        width: 80,
        filter: {
            type: 'int'
        }
    }, {
        dataIndex: 'packageName',
        text: 'Name of Packet',
        width: 300,
        filter: {
            type: 'string'
        }
    }, {
    }];

    return columns;
};



Ext.define('js.grid.PackageGrid', {

    extend: 'Ext.grid.Panel',
    title: '',
    multiSelect: true,
    autoExpandColumn: 'name',
    loadMask: true,
    stateful: true, //*******STATEFUL!!!!

    filterable: true,

    initComponent : function (){

        this.columns = createColumns();

        this.initialConfig.columns = this.columns;

        this.store = new js.grid.PackageStore();

        this.plugins = {
            ptype: 'bufferedrenderer',
            trailingBufferZone: 20,  // Keep 20 rows rendered in the table behind scroll
            leadingBufferZone: 50   // Keep 50 rows rendered in the table ahead of scroll
        };

        this.viewConfig = {
            stripeRows: true,
            enableTextSelection: true
        };

        this.features = {
            ftype: 'filters',
            encode: false,
            local: true
        };

        this.callParent();
    }

});

我的网格代码如下所示：

this.packageGrid = Ext.create('js.grid.PackageGrid', {
    stateId: 'CompletePackageGrid', //for my other instance I obviously use a different string here
    width: 979,
    height: 400,

});

Ext.define('js.grid.PackageStore', {
    extend: 'Ext.data.JsonStore',
    model: 'js.model.Package',
    remoteFilter : false,
    remoteSort: false
});


var createColumns = function () {

    var columns = [{
        dataIndex: 'id',
        text: 'ID',
        width: 80,
        filter: {
            type: 'int'
        }
    }, {
        dataIndex: 'packageName',
        text: 'Name of Packet',
        width: 300,
        filter: {
            type: 'string'
        }
    }, {
    }];

    return columns;
};



Ext.define('js.grid.PackageGrid', {

    extend: 'Ext.grid.Panel',
    title: '',
    multiSelect: true,
    autoExpandColumn: 'name',
    loadMask: true,
    stateful: true, //*******STATEFUL!!!!

    filterable: true,

    initComponent : function (){

        this.columns = createColumns();

        this.initialConfig.columns = this.columns;

        this.store = new js.grid.PackageStore();

        this.plugins = {
            ptype: 'bufferedrenderer',
            trailingBufferZone: 20,  // Keep 20 rows rendered in the table behind scroll
            leadingBufferZone: 50   // Keep 50 rows rendered in the table ahead of scroll
        };

        this.viewConfig = {
            stripeRows: true,
            enableTextSelection: true
        };

        this.features = {
            ftype: 'filters',
            encode: false,
            local: true
        };

        this.callParent();
    }

});

我已经尝试在我的initComponent方法中放入尽可能多的代码，这样就减少了对象被共享的风险

---

我的网格代码看起来怎么样？有什么可以解释这个问题吗？

我建议的第一件事是修改代码。乍一看，它有一系列明显的问题：1）宽度/高度应该是数字，而不是字符串值。2） 布局在网格上是冗余的。3） 指定宽度/高度时，柔性是多余的。4）

remoteFiler

typo。5） 定义一个类，该类有一个方法来拉入一些不相关的全局函数中的列。6） 不存在

autoExpandColumn

config。7）

var me=this从未使用过它。这些都与您的问题无关，但这表明您可能没有完全理解正在编写的某些代码。更新为第1、2、3、4、7点。更新了我的问题，但问题仍然存在。还在看5，6。我认为问题在于第五点。不知何故，这些列被共享或覆盖，因为我在这里使用了一个全局变量。感谢您迄今为止的帮助：）