javascript - 记住 extjs 4 复选框的状态

Question

在我的表单面板中，我添加了一个复选框，设置：

stateful: true,
stateId: 'loginPanelRemeberMe'

然后，在发送表单之前，我保存状态调用：

this.saveState()

在面板上。所有其他组件都会保存它们的状态，当我重新加载页面时，它们会调用以前的状态，但复选框总是以未选中状态开始。有没有办法强制保存价值？

Answer 1

这对我有用：

在您的应用程序启动函数（或控制器初始化函数）中，添加以下内容：

if( Ext.supports.LocalStorage )
{
    Ext.state.Manager.setProvider(new Ext.state.LocalStorageProvider());
}
else
{
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
}

然后在视图中定义您的复选框并覆盖 getState 和 applyState 函数：

{
    xtype: 'checkboxfield',
    getState: function() {
        return { "checked": this.getValue() };
    },
    applyState: function(state) {
        this.setValue( state.checked );
    },
    stateEvents: [
        'change'
    ],
    stateId: 'myCheckBox',
    stateful: true,
    id: 'myCheckBox',
}

经测试可与 ExtJS 4.2 和 6.5.x 一起使用。

Sencha Architect 用户注意事项： 如果您将视图定义为初始视图，Ext.create('YourApp.view.MainPanel')则 Sencha Architect 会在您的启动功能顶部自动添加一个隐藏的 Ext.create 行。这将产生在您的状态提供者可以初始化之前实例化您的视图的不良影响，因此您的字段 applyState 函数将永远不会被调用。

解决方案：取消将您的视图标记为初始视图，并在初始化状态提供程序后手动添加 Ext.create 行。

Answer 2

我找到的解决方案是：我覆盖了面板的状态功能，并添加了一个复选框状态字段。//复选框状态的管理 rememberMe: false,

getState: function() {
    var state = this.callParent();
    state = this.addPropertyToState(state, 'rememberMe', this.rememberMe);
    return state;
},

applyState: function(state) {
    this.callParent(state);
    this.getComponent('checkRememberMe').setValue(state.rememberMe);
},

在提交表单的方法中，我添加了以下行：

//Manage state
var checkRememberMe = this.getComponent('checkRememberMe'); 
if(checkRememberMe.getValue() == true){
    this.rememberMe = checkRememberMe.getValue();
    this.saveState();
}