Extjs - 为选项卡生成唯一的 url

据我了解，ExtJS 使用 AJAX 进行所有服务器端通信，并且理想情况下每个应用程序只有一页。但我正在探索为 ExtJS 选项卡生成唯一 URL 的可能性，然后用户可以从地址栏复制该 URL 以供以后使用（传统 Web 应用程序方法 - 使页面可添加书签）。如果有人做过类似的事情，请告诉我。

您可以利用“哈希”。这是 URL 中“#”字符后面的部分。

如果您只需要在页面加载时对哈希做出反应以支持书签功能，那么您可以使用以下方法：

Ext.onReady(function() {
    var tabPanel = new Ext.TabPanel({
        // Configure for use in viewport as needed.
        listeners: {
            tabchange: function( tabPanel, tab ) {
                window.location.hash = '#'+ tab.itemId;
            }
        }
    });

    var token = window.location.hash.substr(1);

    if ( token ) {
        var tab = tabPanel.get(token);

        if ( ! tab ) {
            // Create tab or error as necessary.
            tab = new Ext.Panel({
                itemId: token,
                title: 'Tab: '+ token
            });

            tabPanel.add(tab);
        }

        tabPanel.setActiveTab(tab);
    }
});

您还可以选择更进一步，使用大多数浏览器最新版本支持的 hashchange 事件。这将允许您在页面完成加载后对用户或编程方式更改的哈希做出反应：

if ( 'onhashchange' in window ) {
    window.onhashchange = function() {
        var token = window.location.hash.substr(1);
        // Handle tab creation and activation as above.
    }
}

值得注意的是，Ext.History 单例承诺提供与此类似的功能。然而，从 ExtJS 3.3.1 开始，它还没有支持 hashchange 事件，而是完全依赖于轮询间隔和隐藏的 iframe hack。我对其在现代浏览器（尤其是 IE）中的性能并不满意，直到我重写它以在可用的情况下使用 hashchange。