window.location.assign() 未被飞镖中的路由器捕获

Question

我尝试使用来自 route_hierarchical/client.dart 的路由器来监听 onpopstate 事件，并 enable/disable 在我的 index.html 中使用 <div>。 （stagehand.pub dart 插件中的示例） 如果这是通过 index.html 中的正常 <a href="/relativePath"> 完成的，它就可以工作。 但是，如果我尝试通过我调用的 button.onClick.listen() 处理程序更改路径：

window.location.assign('/relativePath');

我得到 404，路由器没有正确处理我的事件。 该操作不应该调用 popstate event which is caught by Router like described here?

handlers.dart

...
button.onClick.listen((_){
   window.location.assign('/about');
});

...

router.dart

var router = new Router();
  router.root
    ..addRoute(name: 'about', path: '/about', enter: showAbout)
    ..addRoute(name: 'login', defaultRoute: true, path: '/', enter: showLogin)
    ..addRoute(name: 'context', path: '/context', enter: showContext);
  router.listen();
}

void showAbout(RouteEvent e) {
  // Extremely simple and non-scalable way to show different views.
  querySelector('#login').style.display = 'none';
  querySelector('#about').style.display = '';
  querySelector('#context').style.display = 'none';
} ...

index.html

...
<form>
    <button type="button" id="submit" disabled="true" >
        Login
    </button>
</form>
...

Answer 1

onPopState 是错误的事件。仅当您导航到现有历史记录条目（后退、前进、pushState、转到历史记录中的第二个条目）时才会触发此事件。 您要查找的可能是 window.onHashChange 事件。

Answer 2

好的，看起来我没有通过假设上述行为实现我的目标。

感谢 Günther Zöchbauer 的帮助。 我将其与相应的 Github project 一起归档，因为我认为它应该有效。

我现在使用的和有效的包括历史支持是

router.gotoUrl('/relativePath')

在 onButtonClick 处理程序中。 完全可以做到。