vue钩子函数beforeRouteEnter

beforeRouteEnter 函数内部的 this 为 undefined,这是因为 beforeRouteEnter 是在页面创建前就执行的,
先执行 beforeRouteEnter,再执行生命周期钩子函数 beforeCreate、created 等。

beforeRouteEnter 有三个参数,to、from、next
to:里面是当前页面的路由对象。
from:里面是上一个页面的路由对象。
next:表示进入当前页面,beforeRouteEnter 内必须执行 next() ,否则无法进入页面,可以传入参数 vm 访问组件实例,相当于 this

下面是一个简单的例子:

beforeRouteEnter (to, from, next) {    
      if (sessionStorage.getItem("username")) {  //本地存储取到用户名,表示已登录
        next(true)
      } else { // 未登录
        next(vm => {    // 通过参数 `vm` 访问组件实例
          vm.$router.push('/index') // 返回首页
          alert("请登录")
        })
      }
    }
Logo

前往低代码交流专区

更多推荐