简介:
作用:给组件设置权限
beforeRouteEnter(to,from,next){
通过路由规则,进入该组件时被调用
},
beforeRouteLeave(to,from,next){
通过路由规则,离开该组件时被调用
},
操作:
主页面的Home组件:
<template>
<div class="home">
<h1>我是Home</h1>
</div>
</template>
<script>
export default {
name: "home",
mounted() { },
// 通过路由规则,进入该组件时被调用
beforeRouteEnter(to, from, next) {
if (to.meta.isAuth){
// 如果本地存储的Nuber值为yang就跳转,反之弹出权限不够弹出权限不够
if (localStorage.getItem('Nuber') === 'yang') {
next()
} else{
alert('权限不够')
}
} else{
next()
}
},
// 通过路由规则,离开该组件时被调用 控制路由离开
beforeRouteLeave(to,from,next){
next()
},
};
</script>
如果不给 beforeRouteLeave 设置next() 那么路由就不会进行跳转 ;可以进行判断不填写什么不让跳转路由
beforeRouteLeave(to,from,next){
},