Vue2 详解生命周期

最近使用Vue2做了一个项目,

Vue2 详解生命周期

生命周期钩子分别是:

beforeCreate:实例刚创建,属性绑定之前

created:实例创建完成,属性绑定,但是还未将实例挂载到'el'上,也就是挂载元素上。

beforeMount:模板编译/挂载前

mounted:模板编译/挂载之后

在mounted请求数据时,将数据更新到已经初始化后的数据里。在这个过程中,会先执行beforeUpdate后执行updated,在这两个生命钩子间执行DOM的重新渲染和patch(不知道怎么去形容,原意是补丁的意思,按我理解就是将原来data没有的数据添加到data里面)

在执行手动销毁(实例名.$destroy())后执行beforeDestroy

在beforeDestroy和destroyed之间会将数据监听(watchers),事件监听(listeners)和子组件(components)拆除。

再执行destroyed。

举例对生命钩子的使用:

beforCreate:在加载DOM创建实例时插入loading等

created:结束loading

mounted:发起数据请求,更新数据

beforeDestory:在这可以询问是否是删除某某某

值得一提的是,当你更改数据后,beforeCreate等不会在执行,而是直接执行beforeUpdate和updated