extjs - Extjs - 网址导航

Question

Extjs 更喜欢你的应用程序是一个单页应用程序，但我仍然希望能够做一些事情，比如刷新我的页面并保持我在应用程序中的当前位置，并输入一个 url 以直接到达应用程序中的特定点. 有解决方案吗？

Answer 1

是的，我在我的应用程序中做同样的事情。您可以使用 Ext JS 历史记录机制来执行此操作。看看Sencha 的这个例子。

您可以像这样收听历史更改事件

Ext.History.on('change', function(token) {
    // you navigate-to-target code goes here, e.g. change the viewport content
}

然后，您可以通过将浏览器哈希设置为某个导航目标来启动导航

document.location.hash = yourNavigationToken; 

这使您还能够通过浏览器按钮使用深度链接和前进/后退导航。

你需要初始化历史：

// The only requirement for this to work is that you must have a hidden field and
// an iframe available in the page with ids corresponding to Ext.History.fieldId
// and Ext.History.iframeId.  See history.html for an example.
Ext.History.init();

并将 iframe 和隐藏的输入字段添加到您的页面，如示例中所示：

<form id="history-form" class="x-hide-display">
    <input type="hidden" id="x-history-field" />
    <iframe id="x-history-frame"></iframe>
</form>