vue |
您所在的位置：网站首页 › vue路由钩子函数有哪些及其作用 › vue |
|
正文内容
路由中有三个基本的概念 route, routes, router。
vue-router的三种钩子函数及用处
一、全局钩子函数 beforeEach 和 afterEach
注意（next）
二、单一钩子函数 beforeEnter
三、组件内钩子函数 beforeRouteEnter - beforeRouteUpdate - beforeRouteLeave
四、钩子的作用
用户登录状态验证：
vue-router的俩种模式-hash模式和history模式
1. hash模式（vue-router默认hash模式）（带 #）
2.history模式（不带 #）
总结：
路由中有三个基本的概念 route, routes, router。
route：单一路由， Home按钮 => home内容， 这是一条route, about按钮 => about 内容， 这是另一条路由。 routes ：一组路由，把上面的每一条路由组合起来，形成一个数组。[{home 按钮 =>home内容 }， { about按钮 => about 内容}] router ：是一个机制，相当于一个管理者，它来管理路由。，定义路由只是静止的，当点击完毕后，需要在数组中查询，并且在页面显示出来。 vue-router的三种钩子函数及用处 一、全局钩子函数 beforeEach 和 afterEachbeforeEach 和 afterEach 是vue-router实例对象的属性 注意：每次路由跳转，都会执行beforeEach和afterEach router.beforeEach有三个参数：to/from/next router.beforeEach(function (to,from,next) { console.log(to);//到达的路由 console.log(next);//管道中，可以跳转到其他路由 console.log(from);//离开的路由 next(); }) 注意（next）next() //正常跳转，不写的话，不会跳转，next（false）取消跳转 next: Function: 一定要调用该方法来 resolve 这个钩子。执行效果依赖 next 方法的调用参数。 next(): 进行管道中的下一个钩子。如果全部钩子执行完了，则导航的状态就是 confirmed （确认的）。 next(false): 中断当前的导航。如果浏览器的 URL 改变了（可能是用 |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |