Vue Router 不保留在地址栏中输入的 URL

Posted 2023-03-16

【中文标题】Vue Router 不保留在地址栏中输入的 URL

【英文标题】：Vue Router doesn't preserve URLs entered into the address bar

【发布时间】：2021-06-18 03:35:06

【问题描述】：

所以我有一个在历史模式下运行的 Vue 路由器。单击<router-links> 时效果很好，但我无法将地址栏导航设置为“粘贴”。尽管加载了正确的页面内容，该地址始终会恢复到之前的 URL。

您可以通过运行vue create projectName 并选择Manually select features -> Router -> Vue 3.x -> Use history mode (Y) 自行复制。这将创建下面的示例项目。

如果您导航到http://localhost:8080/about，则会加载“关于”视图。正确。

现在，如果您输入 http://localhost:8080/，主页视图会加载，但 URL 会恢复为 /about！

如果您再次输入http://localhost:8080/about，则会发生完全相反的情况。

是我做错了什么，还是 Vue Router 4 中的错误？

【问题讨论】：

你能告诉我们你的路线（代码）吗？

当然，它们是 Vue CLI 生成的默认路由。 jsfiddle.net/53fuLqr2

【参考方案1】：

原来这是Vivaldi 独有的错误。流行的浏览器使用 Vue Router 显示出预期的行为，甚至是其他 Chromium 浏览器。

我真的应该一开始就检查一下。不过，希望这对其他人有所帮助！