- 时间:2022-07-06 02:42 编辑: 来源: 阅读:311
- 扫一扫,手机访问
摘要:e路由保护(全局路由保护、专用路由保护、内部组件保护)
《源码分享》
一、全局守护(两种,设置在main.js文件下)第一种:router.before each ((to,from,next)= >;{})router.beforeEach((收件人,发件人,下一个)= & gt{ if(to . path = = '/log in ' | | to . path = = '/register '){ next();}else{ alert('您还没有登录,请先登录');下一步('/log in ');}}) #返回参数*to:转到那条路线*from:从那条路线(上一条路线)*next:推迟,next ()-(释放)-next('/登录')-(不要释放,让他跳转到登录页面)-函数{}) #只有两个参数,to:进入哪条路线,from:离开哪条路线。 #如下,每次切换路线,都会弹出提示。单击“确定”显示当前页面。 router.afterEach((to,from)= & gt;{ alert(" after each ");})二、路由独占守护#与路由器文件夹中的index.js文件和path文件在同一级别。 beforeEnter((到,从,下一个)= & gt{//里面的用法和全局的一样})第三,组件#的内部守护写在组件里。与data(){}/1同级的vue。guard beforerouter (to,from,next){//与全局相同}//生命周期尚未开始,因此,该函数没有this//2。组件升级守护beforerouteupdate (to,from,next){//同全局使用}///:id "动态路由改变,页面不重新加载,触发升级守护//3。组件离开guard beforerouteleave (to,from,next){//与全局使用相同。
![](http://bm.damiseo.cn/15914/www.php-asp.net/dami/0731266001646928594tp8-1.jpg)