资讯详情

vue3邂逅--生命周期钩子

vue8种生命周期函数

钩子函数||                触发事件||                现阶段能做的事 1、beforeCreated||vue实例的挂载元素$el和数据对象data都为underfined,还没有初始化||现阶段可加载  2、Created||   vue实例数据对象data但是$el没有||   加载结束时,请求数据为mounted渲染做准备  3、beforeMounted||   vue实例的$el和data初始化已经完成,但仍然是虚拟的dom,具体的data.filter还未替换  4、Mounted||   vue实例挂载完成,data.filter成功渲染||     配合路由构子使用  5、beforeUpdate||   data更新时触发   6、Update||    data更新时触发      7、beforeDestroyed||     部件销毁时触发 8、Destroyed||     部件销毁时触发,vue实例解除了事件监控和和和谐dom绑定(无反应),但DOM节点仍然存在  ![插入图片描述](https://img-blog.csdnimg.cn/075543a43c47427697985cacf7682663.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBA6qeB6Iie5bm95aOR,size_20,color_FFFFFF,t_70,g_se,x_16#pic_center)  解释生命周期过程(12步对应图中操作):  1、生成一个Vue实例,执行钩函数beforeCreate()。【实例创建前】  2、实例初始化。  3、挂载实例成员view model身上,执行钩函数created()。【创建实例】  4、判断有无el对象【el用来指示我们控制的视图是哪个区域。  5、如果有el对象,判断是否使用模板。  6、如果使用模板,则按照编译模板的方法进行。如果没有,则使用模板el视图区域作为模板进行渲染。执行钩函数beforeMount()。【实例挂载前】  7、更改后的新的el替换视图区域,替换原始视图区域el视图区域。执行钩函数Mounted()【实例挂载后】。  8、进入运行阶段,运行阶段就是进行一些操作了,执行钩子函数beforeUpdate()。数据更新前  9、操作完成后,将这些数据渲染到页面上,执行钩函数updated()。【数据更新后】  10、进入销毁阶段,执行钩函数beforeDestroy()【销毁前实例】  11、销毁、拆卸监视器、子组件和事件侦听器。  12、销毁完成,执行钩函数destroyed()。【实例销毁后】 

标签: qeb扩束复合连接器光缆组件

锐单商城拥有海量元器件数据手册IC替代型号,打造 电子元器件IC百科大全!

 锐单商城 - 一站式电子元器件采购平台  

 深圳锐单电子有限公司