Vue url 导航更改

Question

我刚刚开始使用 Vue。我安装了@Vue/Cli（即第 3 版）和 cli-init，因此我可以使用第 2 版的命令。为了创建我的项目，我使用了 vue init webpack 。当运行浏览器上的应用程序时，我注意到了奇怪的行为；我的路线正在改变！

Initial Route "localhost:8080/"

Navigating to the route url 更改为 "localhost:8080/#/"

Also with another route "localhost:8080/about"

Navigating to this route url 变为 "localhost:8080/about#/"

我不明白这是怎么回事。它虽然渲染了组件，但是 url 只是改变了。这是我的路线配置：

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld,
    },
    {
      path: '/about',
      name: 'AboutComponent',
      component: AboutComponent,
    },
    {
      path: '*',
      name: '404',
      component: HelloWorld,
    },
  ],
});

没有路由器链接，我通过键入路径进行导航。我的路由器设置是默认的。

Answer 1

您可能可以通过阅读此处的 vue-router 文档来自己回答问题 (https://router.vuejs.org/guide/essentials/history-mode.html)

默认情况下 vue-router 在 hash 模式下工作。为了与旧浏览器兼容，浏览器中的路由已更改为 'hash'。现在您可以安全地使用历史记录模式，并且您的 URL 在浏览器位置框中不会发生变化。

但是，我建议您阅读并充分理解客户端路由的工作原理以及使您的应用正常运行所需的服务器端配置是什么。

欢迎来到Vue.JS！

Vue url 导航更改

Vue url changes on navigation

vue.js

vue-router

vue-cli-3