vue-router 填坑心得
跳转路由的方法
- router-link标签
- router.push(location, onComplete?, onAbort?) js去做
- router.replace 区别是不添加history记录
- 当然了a标签也是可以的
除了嵌套路由,有时候还可以这样
<router-view class="view one"></router-view>
<router-view class="view two" name="a"></router-view>
<router-view class="view three" name="b"></router-view>
所以,不要小看路由的name属性
const router = new VueRouter({
routes: [
{
path: '/',
components: {
default: Foo,
a: Bar,
b: Baz
}
}
]
})
重定向与别名
const router = new VueRouter({
routes: [
{ path: '/a', redirect: '/b' }
]
})
别名:
/a 的别名是 /b,意味着,当用户访问 /b 时,URL 会保持为 /b,但是路由匹配则为 /a,就像用户访问 /a 一样。
const router = new VueRouter({
routes: [
{ path: '/a', component: A, alias: '/b' }
]
})
beforeRouteEnter
路由拦截,A->B,一般是在B页面中设置,和data平级,可以做一些处理