vue的生命周期钩子函数 父子组件及缓存组件可以使用哪些函数

近期做vue的缓存等，路由比较复杂，认识了几个新的钩子函数，在此记录下

生命周期函数

• beforeCreate --vue实例被创建之前（没有$el，没有$data）
• created --vue实例创建完成，初始化data数据（没有$el，有$data）
• beforeMount – 虚拟DOM，编译模板（没有$el，有$data）
• mounted – 挂载编译后的html到对应位置，编译好的html替换虚拟DOM（有$el，有$data）
• beforeUpdate --组件数据发生变化，更新前
• updated --组件数据发生变化，更新后
• beforeRouteEnter
• beforeRouteLeave
• activated
• deactivated
• beforeDestroy --组件实例销毁前
• destroyed

一、 组件间函数的关系

1. keep-alive下的组件

• 有缓存的时候，组件渲染完一次，以后只执行deactivated,dedeactivated两个函数
• 有缓存的时候，还执行beforeRouterEnter和beforeRouterLeave两个函数

2.兄弟组件

• 当路由发生转变时，前一个组件执行beforeDestroy的时候，window.location.href已经变了后一个组件的location

3.父子组件

• 路由变化的时候，正常组件会触发route和destroy的钩子
• 子组件没有beforeRouteEnter、beforeRouteLeave
• 子组件，父组件没有缓存的时候，路由变化用beforeDestroy,destroyed监控
• 子组件，父组件有缓存的时候，路由变化用activated,deactivated监控

二、子路由和父路由缓存问题

1.父路由加了缓存，子路由没加缓存，子路由组件不缓存
2.父路由没加缓存，子路由加了缓存，当父路由改变时，子路由缓存失效，父路由不变时，子路由缓存生效

详解：https://blog.csdn.net/qq_34664239/article/details/89499120