Question

如何在Ext 4？

中恢复折叠面板的状态

我使用以下内容，但未恢复：

    var panel = Ext.create('Ext.panel.Panel', {
        id: 'panel',
        stateful: true,
        stateId: 'panelState',
        stateEvents: ['collapse', 'expand'],
        getState: function () {
            Console.log('get state' + this.collapsed);
            return {

                collapsed: this.collapsed
            }
        },
        applyState: function (state) {
            Console.log('apply state' + this.collapsed);
            if (state) {
                Ext.apply(this, state);
            }
        },
        saveState: function() {
            Console.log('save state' + this.collapsed);
            debugger;
            var me = this,
                id,
                state;
            if (me.stateful !== false) {
                id = me.getStateId();
                if (id) {
                    state = me.getState();
                    if (me.fireEvent('beforestatesave', me, state) !== false) {
                        Ext.state.Manager.set(id, state);
                        me.fireEvent('statesave', me, state);
                    }
                }
            }
        },
        height: 100,
        border: false,
        style: { zIndex: 100 },
      });

Answer 1

我不知道Ext4，但在Ext3中，我们有Ext.Component（以及Ext.Panel）：

applyState : function(state){
    if(state){
        Ext.apply(this, state);
    }
}

因此，您似乎必须通过覆盖此applyState来自行恢复崩溃，大小，位置等。

再一次，我在谈论Ext3。

Answer 2

我正在使用上述状态配置作为门户面板。我希望在完成面板拖放后捕获x和y位置。为此我做了这个：

listeners : {
            'close' : Ext.bind(this.onPortletClose, this)
        },
stateEvents: ['collapse', 'expand'],
  getState: function () {                              
      return {
          collapsed: this.collapsed
      }
  },       
  getPosition: function(local) {        
        var el = this.el,xy;
    if (local === true) {return [el.getLeft(true), el.getTop(true)];
        }xy = this.xy || el.getXY();         
         if (this.floating && this.floatParent) {
           var o = this.floatParent.getTargetEl().getViewRegion();
             xy[0] -= o.left;
            xy[1] -= o.top; }
            xy[2]=this.collapsed;
             return xy;
            },          
  applyState: function (state) {                               
      if (state) {
          Ext.apply(this, state);
      }
  },
  saveState: function() {               
      debugger;          
      var me = this,
          id,
          state,pos;            
      if (me.stateful !== false) {
          id = me.getStateId();
          if (id) {
              state = me.getState();                  
              // saveAllPosition();
                 saveUserPosition();// gets fired three times. i want it only once after drag drop completed
              if (me.fireEvent('beforestatesave', me, state) !== false) {
                  Ext.state.Manager.set(id, state);
                  me.fireEvent('statesave', me, state);
              }
          }
      }
  }

恢复Ext面板状态

2 个答案: