Vue生命周期
生命总共分为4大阶段创建前/后、载入前/后、更新前/后、销毁前/后共8个方法。
创建前/后 :
在 beforeCreate 阶段,vue实例的挂载元素el和数据对象data都为undefined,还未初始化。在
created 阶段,vue实例的数据data有了,el还没有。
*创建阶段:主要是处理数据(主要:对数据进行挟持,把data对象上的数据挂到了this实例上)!!
挂载前/后:
在 beforeMount 阶段,vue实例的$el和data都初始化了,单还没有挂载之前都是虚拟的demo阶段,data.message还未替换.在 mounted 阶段,vue实例挂载完后,data.message成功渲染.
*挂载阶段:主要是合成数据和视图模板,先在内存完成虚拟dom解析,最后一次dom操作直接更新到页面。
更新前/后:
当data变化后,针对视图发生更新前后触发 beforeUpdata 和 updata 方法。
*更新阶段:主要是完成对视图的动态修改。
销毁前/后:
在执行 destroy 方法后,对data的改变不会再触发周期函数,说明此时vue实例已经结束了事件监听以及和dom的绑定,但是dom结构依然存在。
*销毁阶段:主要是完成对组件的回收。
发请求最佳时间:大部分场景都会操作dom,就放到 created 生命周期钩子函数里面
created(){
this.$nextTick(() => { /* code */ })
}
网友评论