重置路线而不是向当前路线添加新路线

reset route instead of adding a new route to the current one

我想创建一个路由器导航并防止 404 错误。当将有效的 URL 操作为无效的时,下一个路由器 link 将不再工作。我创建了一个工作示例

https://codesandbox.io/s/8l60y06pmj

要查看问题,请执行以下步骤:

现在你应该有以下内容URL

https://8l60y06pmj.codesandbox.io/#/pageTwo/pageThree

但正确的URL应该是

https://8l60y06pmj.codesandbox.io/#/pageThree

您可以通过单击 link 导航到主视图来重置此行为。

我该如何解决这个问题?

NavbarComponent.vue里面,您需要在两个页面链接中添加一个/;更改后应该看起来像这样。

<router-link to="/pageTwo">Page Two</router-link> | 
<router-link to="/pageThree">Page Three</router-link>

如果没有斜杠,您实际上并没有告诉 Vue Router 将用户发送到新页面。

Here's a working version of your CodeSandbox.