ExtJS与状态保存

节选自作者的博客：

在我这个例子中，我将会记住tab面板显示的tab。由于这是常见的情形，我就扩展TabPanel定义一个新类：

Javascript代码

1. Ext.ux.StatefulTabPanel = Ext.extend(Ext.TabPanel, {  
2.  stateEvents: ['tabchange'],  
3.  getState: function() {return{tab:this.getActiveTab().id}},  
4.  applyState: function(state) {this.setActiveTab(state.tab);}  
5. });  

要配合运作，系统需要一个状态管理器（state manager），用于负责保存状态的数据。实际上系统内已有一个状态管理器在cookie中。如果你想保存在服务器上就另须一个别的状态管理器。按照我 的经验我是比较倾向于使用浏览器的cookies来保存用户的机器的信息。这里我希望它存活的比默认的一天长：

Javascript代码

1. Ext.state.Manager.setProvider(  
2.  new Ext.state.CookieProvider({  
3.   expires: new Date(new Date().getTime()+(1000*60*60*24*365)), //一年后  
4.  }));  

在开始位置的Ext.onReady函数中加上以上的代码。

处理过程不是太复杂，只需用到applyState()的方法。如果你只是需要保存某些现有的字段 可隐式调用applyState（学习疑问：重写便可？）。 本例中，根据键值activeTab来设置活动的tab：

Javascript代码

1. Ext.ux.StatefulTabPanel = Ext.extend(Ext.TabPanel, {  
2.  stateEvents: ['tabchange'],  
3.  getState: function() {return{activeTab:this.getActiveTab().id}},  
4. });  

************
有意思的是，作者是一个拥有28年软件开发经验的50岁前辈！