简述vue生命周期及运行的钩子函数
时间: 2023-11-12 14:53:45 浏览: 92
Vue的生命周期分为8个阶段,分别是:
1. beforeCreate:组件实例被创建之初,此时数据观测和事件机制都未初始化,无法访问到data、computed、watch、methods、$el等选项。
2. created:组件实例已经完成了数据观测,也就是data、computed、watch等选项都可以访问,但是此时还未完成模板的编译,$el选项还不能访问。
3. beforeMount:模板编译完成,但尚未挂载到页面上。
4. mounted:模板已经被挂载到页面上,此时可以访问到$el选项,也可以对DOM进行操作。
5. beforeUpdate:组件更新之前,此时data数据已经更新,但是DOM还没有更新。
6. updated:组件更新完成,此时DOM已经更新完成,可以进行操作。
7. beforeDestroy:组件销毁之前,此时组件实例仍然可以访问。
8. destroyed:组件已经销毁,此时组件实例已经无法访问。
Vue的运行钩子函数包括:
1. beforeCreate:在实例初始化之后,数据观测之前被调用。
2. created:实例创建完成后被立即调用,此时完成了数据观测和初始化,但是还没有挂载到页面上。
3. beforeMount:在挂载开始之前被调用,也就是在模板编译之后,但是在将模板渲染到页面之前。
4. mounted:在挂载到页面之后被调用,此时可以进行DOM操作。
5. beforeUpdate:在组件更新之前被调用,此时data数据已经更新,但是DOM还没有更新。
6. updated:在组件更新之后被调用,此时DOM已经更新完成,可以进行操作。
7. beforeDestroy:在实例销毁之前被调用,此时组件实例仍然可以访问。
8. destroyed:在实例销毁之后被调用,此时组件实例已经无法访问。
阅读全文