vue-router的跳转主要有两种方式hash和history

hash即地址栏URL中的#号，比如http://baidu/#/home这种路由就是hash路由，hash虽然后出现在url中，但是不会被包括在HTTP请求中，对后端没有影响

history利用了HTML5的History Interface 中新增的pushState()和replaceState()，借鉴出的vuehistory模式，如果你需要配置history模式，必须要和后端进行统一，否则会出现404

 

如果配置hash或者history，在VueRouer中有一个mode属性，默认是hash，如果配置了history，就是没有#符号的

 1 import vue from "vue"
 2 import vueRouter from "vue-router"
 3 vue.use(vueRouter)
 4 let router=new vueRouter({
 5    mode:'history',
 6     linkActiveClass:'is-active',
 7     routes:[
 8         {
 9             path:'/home',
10             name:'/home',
11             component:()=>import('@/views/Home')   
12         },
13         {
14             path:'/sport',
15             name:'sport',
16             component:()=>import('@/views/Sport')                
17             }        
18     ]
19 })
20 export default router

 

hash和history模式_地址栏