Vue.js 学习笔记(贰拾)

65 阅读1分钟

【6月日新计划更文活动】第10天

路由守卫

独享守卫

beforeEnter: (to, from, next) => {
  console.log("前置独享路由守卫", to, from)
  if (to.meta.isAuth) { // 判断是否需要鉴权
    if (localStorage.getItem('school') == 'AtGuigu') {
      next()
    } else {
      alert("学校名不对,有权限")
    }
  } else {
    next()
  }
},

组件守卫:

// 通过路由规则,进入该组件时被调用
  beforeRouteEnter(to, from, next) {
    if (to.meta.isAuth) {
      // 判断是否需要鉴权
      if (localStorage.getItem("school") == "AtGuigu") {
        next();
      } else {
        alert("学校名不对,没有权限");
      }
    } else {
      next();
    }
    // ...
  },
// 通过路由规则,离开该组件时被调用
  beforeRouteLeave(to, from, next) {
    console.log("beforeRouteLeave", to, from);
    next();
    // ...  },