Ext JS를 사용하여 탭을 책갈피로 지정 하시겠습니까?

Question

Ext jS에서 의 북마크의 북마크가 필요합니다.

여러 탭이 포함 된 탭 패널이 있으며 개별 탭을 클릭하면 URL이 변경됩니다. 현재 해시를 사용 중입니다. 그러나 "id + 구분 기호 + 다른 ID의"URL을 사용하여 페이지를 직접 탐색 할 때 앱을 복원 할 수 없습니다. 나는 expire 설정 (Ext.state.Manager 및 Ext.state.CookieProvider를 사용)를 사용하여 페이지의 현재 상태를 저장하여 현재 문제를 해결 한

launch : function() { 
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider(
      { 
       expires : new Date(new Date().getTime() 
         + (1000 * 60 * 60 * 24 * 7)) 
      })); 

var tabPanel=new Ext.TabPanel({ 
    width:1000, 
    title:'TabPanel', 
    height:700, 
    id:'main-tab', 
    activeTab:0, 
    layout:'fit',  
    region:'north', 
    stateful:true, 
    stateId:'tp1', 
    stateEvents:['tabchange'], 
    getState:function(){ 
     return { 
      activeTab:this.items.findIndex('id',this.getActiveTab().id)    
     }; 
    }, 
    applyState:function(s){ 
     this.setActiveTab(s.activeTab); 
    }, 
    items: 
     [ 
      //included tabID and title 
     ], 
    listeners:{    
       tabchange:function(tabPanel,currTab){          
        window.location.hash='#myTabs/'+currTab.id; //config.position; 
        console.log(window.location);     
       } 
     } 
}); 

var viewport=new Ext.Viewport({ 
    id:'main-viewport',  
    layout : 'fit', 
    title:'Main', 
    deferredRender:true, 
    items : [ tabPanel ], 
    width:200, 
    region:'west' 
}); 

viewport.doLayout(); 

: 여기

는 샘플 코드입니다.

그러나 내가 사용하는 URL은 인 모든 시간 동안 유효한 이어야합니다. 또한

, 내가 지난 URL을 방문 할 때입니다 .../응용 프로그램/즐겨 찾기는/services.html #의 myTabs/5 내가 에 다시 내 URL을 chnage .../응용 프로그램/즐겨 찾기는/services.html, 내 기본 (내 경우에는) 탭으로 돌아 가야합니다. 대신 .../apps/Bookmarking/services.html # myTabs/5으로 이동합니다.

어떻게 수정할 수 있습니까?

미리 감사드립니다.

PS :이 문제 http://www.sencha.com/forum/showthread.php?154174-Bookmarking-and-History-in-extjs

Answer 1

난 당신이 Ext.util.History보고 바른 길에 생각에 대한 변경 내역의 전체 집합에 대한이 링크를 확인하시기 바랍니다. 불행히도 나는 방금 their example에 버그를 발견했다고 생각합니다.

항상 렌더링 후에 활성 탭을 설정하는 것이 아닙니다.

function onAfterRender() { 
    ... 

    var activeTab1 = Ext.getCmp('main-tabs').getActiveTab(), 
     activeTab2 = activeTab1.getActiveTab(); 

    onTabChange(activeTab1, activeTab2); 
} 

토큰이없는 경우 설정하려고 시도 할 수 있습니다.

Ext.util.History.on('ready', function(history){ 
    if (!history.getToken()) { 
     var activeTab1 = Ext.getCmp('main-tabs').getActiveTab(), 
      activeTab2 = activeTab1.getActiveTab(); 

     onTabChange(activeTab1, activeTab2); 
    } 
}, this);