欢迎光临散文网 会员登陆 & 注册

千锋教育前端Vue3.0全套视频教程(Kerwin2023版,Vue.js零基础

2023-07-17 16:46 作者:爱吃qq糖的老鼠  | 我要投稿
  1. Vue组件生命周期钩子函数是在组件不同阶段执行的特定函数。这些钩子函数提供了在组件生命周期中执行自定义逻辑的机会。生命周期钩子函数主要有四个阶段,八个函数:beforeCreate:作用:在实例被创建之前调用,此时组件的选项和数据尚未初始化。

created:作用:在实例创建完成后调用,此时组件的选项和数据已经初始化。

beforeMount:作用:在组件挂载之前调用,此时模板编译已完成,但尚未将组件渲染到页面中。

mounted:作用:在组件挂载到页面后调用,此时组件已经被渲染到页面中。

beforeUpdate:作用:在组件更新之前调用,此时数据已更新但尚未重新渲染组件。

updated:作用:在组件更新完成后调用,此时组件已重新渲染到页面中。

beforeDestroy:作用:在组件销毁之前调用。

destroyed:作用:在组件销毁完成后调用。


2.Vue 的父子组件生命周期钩子函数执行顺序:

Vue 的父子组件钩子函数的执行顺序可以归类为4个 部分:

第一部分:首次加载渲染

父 beforeCreate -> 父 created -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount -> 子 mounted -> 父 mounted。

第二部分:父组件修改子组件的props值时:

父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated

第三部分:父组件修改的数据跟子组件没有关系时,

不会影响子组件 父 beforeUpdate -> 父 updated

第四部分:销毁过程

父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed


千锋教育前端Vue3.0全套视频教程(Kerwin2023版,Vue.js零基础的评论 (共 条)

分享到微博请遵守国家法律