vue的生命周期

vue的生命周期

1、vue的生命周期是什么

vue每个组件都是独立的,每个组件都有一个属于它的生命周期,从一个组件创建、数据初始化、挂载、更新、销毁,这就是一个组件所谓的生命周期。

2 、vue生命周期详细介绍

  • beforeCreate

    实例组件刚创建,元素DOM和数据都还没有初始化。

  • created

    数据data已经初始化完成,方法也已经可以调用,但是DOM未渲染。

  • beforeMount

    DOM未完成挂载,数据也初始化完成,但是数据的双向绑定还是显示{{}}

  • mounted

    数据和DOM都完成挂载,在上一个周期占位的数据把值给渲染进去。

  • beforeUpdate

    只要是页面数据改变了都会触发,数据更新之前,页面数据还是原来的数据。

  • updated

    只要是页面数据改变了都会触发,数据更新完毕,页面的数据是更新完成的。

  • beforeDestroy

    在组件销毁之前执行

  • destroyed

    在组件销毁之前执行

3、问题以及解决方案

在之前的开发过程中,有一次不小心将数据挂载到created里面,结果取数据的时候一直取不出来,捣鼓了半天去看官方文档,原来vue是有生命周期的,在created里面挂载数据的话是运行在mounted之前的,获取不到数据所以就取不到数据了,得出结论:接口要写在created里面,渲染方法要写在mounted里面这样不会出错。

4、总结

总得来说就是实例的创建和销毁这段时间的一个机制。

5、参考

vue官方文档

谈谈vue生命周期

posted @ 2020-10-09 00:01  会飞的大野鸡  阅读(21)  评论(0编辑  收藏