vue-router 介绍和使用

Question

VueRouter

模式： hash、history

跳转方式：

1. this.$router.push()
2. this.$router.replace()
3. </router-link>

占位： </router-view>

默认情况下是 hash 模式，history 需要后台配置，利用 Html5 的 History API 实现的，监听 change 变化。

router 和 route 的区别：

$router： 是 VueRouter 的一个 实例 ，是一个 全局的对象 ，主要 实现路由的跳转使用 。常用的 router.push() 和 router.replace() 方法。

push 方法会像浏览器的 history 栈添加一个新纪录。

replace 替换路由，没有历史记录。

route： 是一个 路由信息对象 ， 每一个路由都有一个 route 对象 ，是一个 局部对象 。可以获取 name、query、params、path 等参数。

vue-router 有哪几种导航钩子?

三种

全局导航钩子

router.beforeEach(to, from, next),

router.beforeResolve(to, from, next),

router.afterEach(to, from )

组件内钩子

beforeRouteEnter,

beforeRouteUpdate,

beforeRouteLeave

单独路由独享组件

beforeEnter