From Learn About the Ext JavaScript Library

내 블로그 에서 퍼온 글:

저의 예제에서 탭 패널에 탭을 표시하기 위해 저장할 것입니다. 왜냐하면 이것은 상태변화가 일반적으로 일어나기 때문에 탭 패널을 기반으로 새로운 클래스를 만들었다.

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

이 시스템이 동작하기 위해서는 데이터를 저장하기 위한 방법인 state manager(상태 관리자)가 요구되어 집니다. 시스템(Ext.state Package)은 이미 쿠키에서 상태를 저장하는 것(Provider)을 가지고 있습니다. 만약 서버에 상태를 저장하기 원한다면 새로운 메니저가 필요합니다. 내 경우에는 사용자와 머신의 상태를 브라우저에 유지하기 위해서 쿠키만을 사용하면 돼서 아주 기뻤습니다. 그리고 나는 그것이 기본으로 하루보다 더 길게 남아 있기 원했습니다

Ext.state.Manager.setProvider(
 new Ext.state.CookieProvider({
  expires: new Date(new Date().getTime()+(1000*60*60*24*365)), //지금부터 1년 동안
 }));

이 코드를 주된 Ext.onReady 함수의 시작 부분에 추가하세요.

applyState()는 좀더 복잡한 처리를 위해서만 필요합니다. 만약 이미 존재하는 필드들의 상태를 저장하기 위해서만 필요하다면 applyState는 암묵적으로 호출 될 수 있다. 예제에서는 활성화된 탭을 activeTab 필드에 설정합니다.

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