组件生命周期钩子函数

一个组件从创建到销毁会经历一系列的特殊过程，把执行过程叫做组件的生命周期 每个生命周期都会执行特殊的函数，把这些函数称为生命钩子函数vue生命周期4组8个常用 创建前后，挂载前后︰更新前后，销毁前后 beforeCreate() { console.log('beforeCreate', '创建前'); }, created() { console.log('created', '创建完成'); }, beforeMount() { console.log('beforeMount', '挂载前'); }, mounted() { console.log('mounted', '挂载完成'); }, beforeUpdate() { console.log('beforeUpdate', '更新前'); }, updated() { console.log('updated', '更新完成'); }, beforeDestroy() { console.log('beforeDestroy', '销毁前'); clearInterval(this.interID) }, destroyed() { console.log('Destroy', '销毁完成'); }

常用的钩子函数

created 创建完成 可以获取this ajax加载 开启定时器mounted 挂载完成（内容以及渲染完毕） 可以获取dom节点beforeDestroy 销毁前 清除定时器 移除监听事件

vue父子组件生命周期执行顺序

加载渲染过程：父beforeCreate —> 父created —> 父beforeMount —> 子beforeCreate —> 子created —> 子beforeMount —> 子mounted —> 父mounted子组件更新过程：父beforeUpdate —> 子beforeUpdate —> 子updated —> 父updated父组件更新过程：父beforeUpdate —> 父updated销毁过程：父beforeDestroy —> 子beforeDestroy —> 子destroyed —> 父destroyed