Extjs 拆分器移动后hbox宽度的保存状态

我正在尝试保存面板的可视状态。该面板由两个子容器组成，它们之间有hbox/flex布局和拆分器

{
  xtype:'panel',
  layout: {
    align: 'stretch',
    type: 'hbox'
  },
  items:[
    {
      xtype:'container',
      title: 'left panel',
      flex:1
    },
    {
      xtype:'splitter'
    },
    {
      xtype:'container',
      title: 'left panel',
      flex:2
    }
  ]
}

我已经有一个工作状态经理了。“左面板”包含一个网格，网格可以很好地存储其列状态。状态管理器通过以下方式从控制器初始化函数激发：

var stateProvider=Ext.create('Ext.state.LocalStorageProvider');
Ext.state.Manager.setProvider(stateProvider);

网格使用框架标准的方法来存储其状态，方法是设置stateId:“GridState”和stateful:true

但是，我无法理解ExtJS希望我如何处理主布局的flex值。我已尝试在拆分器上设置stateful和stateId。我尝试过不使用事件，也使用stateEvents:['move']。我还尝试在leftpanel上设置stateful，并使用stateEvents调整大小。最后，我尝试在父面板上设置stateful，有无stateEvents:afterlayout

我知道移动拆分器后可以获取事件。然后，我可以将flex值存储为自定义状态，并在布局/渲染过程中手动查找它们，但是我想对于一个看似微不足道的问题，一定有一种更标准的方法

---

存储hbox/vbox布局的“拆分器位置”/“弹性值”的标准框架方法是什么？

是的，有一种添加状态的标准方法。拆分器没有默认状态，因此必须添加以下功能：

举例说明：

getState: function () {
    var me = this;
    var state = {};
    state.yourCustomState = 'state'; //you can save what you want
    return state;
},

applyState: function (state) {
    var me = this;

    if (state && state.yourCustomState) {
        //Do stuff
    }
}

如果需要触发状态，则可以使用stateEvents：

您可以将调整大小事件添加到stateEvents