我正在尝试使用React路由器4来确保我可以使用router.history.push
从我的顶级应用程序以编程方式更改路由。例如,如果我需要在异步操作等之后执行此操作,则mui App将呈现一个包装器,其显示AppBar和抽屉/菜单,然后呈现其子项,在这种情况下,这是一个<Switch>
元素。该应用程序从上下文中抓取路由器(我知道我可以使用withRouter,但我只是尝试了这个)。如果菜单内部使用<Link>
元素,则它按预期工作,并且Switch显示预期的路径。但是,如果菜单将路由分派给App,并通过路由器将它们推送,那么即使调用了Wrapper.render,URL也会更改,但交换机不会更新。
我重新创建了此沙箱中的情况,其中Page 2菜单使用了链接,但Home和Page 1项目将路由分发到App。在查看Router.Link
的源代码时,它似乎最终正在做我的应用程序正在做的事情(通过上下文和推送获取路由器),所以我试图了解发生了什么。这是沙箱:
https://codesandbox.io/s/olnp135zmy
谢谢!