vue 生命周期5 总结 （8个钩子除路由三个钩子）

要点： 

 

 

重要的只有两个流程,挂载后(mounted)做初始化的事 销毁前(beforeDestroy)做收尾的事

 

这边讲了8个钩子,还有3个钩子到路由那再说

拆分为4对：
1.

beforeCreate和created  创建之前和创建完毕

beforeCreate是在数据监测和数据代理创建之前,

 created是在数据监测和数据代理创建之后

也就是以创建数据代理和数据监测为分界线

注：不要误认为为vm创建前！！！！！！！,不然beforeCreate连this都读不到

2.beforeMount和mounted 挂载之前和挂载完毕

3.beforeUpdate和 updated 更新之前和更新完毕

4.beforedestroy和destroy   销毁之前和销毁完毕

引用之前的那个改变透明度的小案例

并增加一个功能当,点击一个按钮,让它透明度定格,不变了

虽然外卖这边用了vm.$destroy相当与vm自己把自己销毁了但是在一般开发下,都不会调用$destroy,一般都是以他杀的形式将它销毁

这样写会报错因为 id只在mounted作用域内

 

 解决一，不推荐不太好

用let定义中转

 解决二：

直接定义一个this.xxx 直接把值定义在vm上,当别的要调用,只需this.xxx即可

实现了效果,但是这种改变太轻度了 

 

比如

修改对应透明度,仍可修改,也就是说这样子,只是把定时器关了

如果要重度的关闭,即把vm也销毁了

点了也没用了,改变不了透明度了

 

但是定时器还没有关

验证：

定时器还在走,vm虽然没了但是定时器还在走

 

把前面两者结合

可以实现效果

 

但是那个关闭定时器还可以写在beforeDestroy

 

运行流程：

当调用$destroy ，就会触发beforeDestroy和destroyed,然后在beforeDestroy写上关闭定时器就能实现

引用beforeDestroy的意义

当,一个vm不是被自己销毁而是被其他销毁，则无法只有回调函数,能实现在销毁前,关闭定时器

但用beforeDestroy可以

用beforeDestroy写的话,无论,自我销毁,还是其他导致的销毁，只要进行销毁,就会调用beforeDestroy  其中就可以写许多的善后工作,比如关定时器等等

 

总结：