Vue生命周期和beforeRouteEnter理解
1、beforeRouteEnter(to,from,next)beforeRouteEnter 函数内部 this 是undefined,这是因为在执行路由钩子函数beforRouteEnter时候,组件还没有被创建出来;先执行beforRouteEnter,再执行组件周期钩子函数beforeCreate。我们可以通过 next 获取组件的实例对象,如:next( (vm)=>{} )..
1、beforeRouteEnter(to,from,next)
beforeRouteEnter 函数内部 this 是undefined,这是因为在执行路由钩子函数beforRouteEnter时候,组件还没有被创建出来;先执行beforRouteEnter,再执行组件周期钩子函数beforeCreate。我们可以通过 next 获取组件的实例对象,如:next( (vm)=>{} ),参数vm就是组件的实例化对象。
beforeRouteEnter (to, from, next) {
if (to.meta.needLogin && to.meta.mustAgent) {
next(vm => {
vm.needLogin = true
vm.mustAgent = true
})
} else if (to.meta.needLogin || to.meta.mustAgent) {
next(vm => { to.meta.needLogin ? vm.needLogin = true : vm.mustAgent = true })
} else {
next()
}
}
to参数如下
2、beforeRouteLeave 的三个参数分别是
1、to:要去的页面
2、from: 本页面地址
3:next 下一步
** 这个离开守卫通常用来禁止用户在还未保存修改前突然离开。该导航可以通过 next(false) 来取消。
2、数据对象data:初始化属性,响应数据变化,data
必须声明为返回一个初始数据对象的函数,因为组件可能被用来创建多个实例。
3、计算属性computed: 将function内return的值赋值在html的DOM上,computed内的function也只执行一次。computed具有缓存能力,仅当function内涉及到Vue实例绑定的data的值的改变,function才会重新执行,并修改DOM上的内容。
更多推荐
所有评论(0)