本节知识点
- 路由中的函数生命周期
使用指南
有两种方式
第一种就是在路由配置文件里面写钩子函数只有一个就是beforeEnter
第二种就是在模板里面写钩子函数他有两个 beforeRouterEnter beforeRouterLeave
先说第一种 路由里面写配置
找到路由文件 index.js里面
{
path: '/',
name: 'HelloWorld',
components: {
default: HelloWorld,
left: Hi1,
right: Hi2,
}
},
beforeEnter:(to,from,next)=>{
console.log("我进来了");\
console.log(to);
console.log(from);
}
- 三个参数
to 路由将要跳转的路径信息,信息是包含在对象里面的
from 路径跳转前的路径信息,也是一个对象的形式
next 路由的控制参数。常用的next(true)和next(false)
我们再来说说第二种模板里面的钩子函数
- beforeRouterEnter:在路由进去前的钩子函数
- beforeRouterLeave:在路由离开的钩子函数
export default {
name:"Hi2",
data(){
return {
message2:"这个就是Hi2页面"
}
},
beforeRouterEnter:(to,from,next){
console.log("我进来了")
}.
beforeRouterLeave:(to,form,next){
console.log("我离开了")
}
}