导航上的Vue网址更改

时间:2018-09-24 21:05:09

标签: vue.js vue-router vue-cli-3

我刚开始使用Vue。我安装了@ Vue / Cli(版本3)和cli-init,因此可以使用版本2的命令。为了创建我的项目,我使用了vue init webpack。 在浏览器上运行该应用程序时,我注意到了奇怪的行为; 我的路线正在改变!

Initial Route“ localhost:8080 /”

Navigating to the route网址更改为“ localhost:8080 /#/”

Also with another route“ localhost:8080 / about”

Navigating to this route,网址更改为“ 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,
    },
  ],
});

没有路由器链接,我通过输入路径进行导航。 我的路由器设置为默认设置。

1 个答案:

答案 0 :(得分:0)

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

默认情况下,vue-router在 hash 模式下工作。在浏览器中使用“哈希”更改了路由,以与旧浏览器兼容。如今,您可以安全地使用历史记录模式,并且URL不会在浏览器位置框中更改。

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

欢迎使用Vue.JS!