3

Ext jSでのタブのブックマークについて助けが必要です。

複数のタブを含むタブ パネルがあり、個々のタブをクリックすると URL が変更されます。私は現在ハッシュを使用しています。ただし、「 id + delimiter + other id」の URL を使用してページに直接移動すると、アプリを元に戻すことができませんでした。

サンプルコードは次のとおりです。

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();

構成を使用してページの現在の状態を保存することにより、現在問題を解決しましたexpire（Ext.state.Managerおよびを使用Ext.state.CookieProvider）。

ただし、私が使用する URL は、一定期間有効である必要があります。

また、最後にアクセスした URL が.../apps/Bookmarking/services.html#myTabs/5 で、URL を.../apps/Bookmarking/services.htmlに戻すと、デフォルトに戻るはずです。 （私の場合は最初に）タブ。代わりに、.../apps/Bookmarking/services.html#myTabs/5に戻ります。

どうすればそれを修正できますか?

前もって感謝します！

PS: この問題に対して私が行ったすべての変更については、このリンクを確認して ください http://www.sencha.com/forum/showthread.php?154174-Bookmarking-and-History-in-extjs

4

1 に答える 1

0

Ext.util.Historyを見て正しい軌道に乗っていると思います。残念ながら、彼らの例でバグを発見したと思います。

レンダリング後に常にアクティブなタブを設定するのではなく;

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);
于 2013-04-04T15:29:23.633 に答える