为什么所有路径都跳转到根路径（vue-router）？答案

【问题标题】：Why all the paths jump to the root path（vue-router)?为什么所有路径都跳转到根路径（vue-router）？
【发布时间】：2018-11-25 01:42:14
【问题描述】：

我用 vue-cli 初始化了一个项目，我刚刚配置了路由器。为什么我尝试输入时总是打开'HelloWorld'组件：'http://localhost:8080/HelloWorld2'或'http://localhost:8080/HelloWorld1'。

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import HelloWorld1 from '@/components/HelloWorld1'
import HelloWorld2 from '@/components/HelloWorld2'
import HelloWorld3 from '@/components/HelloWorld3'

Vue.use(Router)

export default new Router({
    routes: [
       {
           path: '/',
           name: 'HelloWorld',
           component: HelloWorld
       },
       {
           path: '/HelloWorld1',
           component: HelloWorld1,
           // childres:[
           //     {
           //         path: 'HelloWorld3',
           //         component: HelloWorld3,
           //     },
           // ]
       },
       {
           path: '/HelloWorld2',
           component: HelloWorld2
       }
   ]

})

【问题讨论】：

标签： vue-router

【解决方案1】：

vue-router 默认使用 hash 模式。在您的配置中，您可能希望使用 html5 历史模式。参考https://router.vuejs.org/guide/essentials/history-mode.html#example-server-configurations。

这可以在您的路由器设置中更改：

const router = new VueRouter({ mode: 'history', routes: [...] })

【讨论】：