八大生命周期
beforeCreate created beforeMount mounted beforeUpdate updated beforeDestory destroyed
内置方法初始化
props => methods =>data => computed => watch
beforeCreate
在内存刚刚创建
被调用后
初始化 inject
初始化 props => methods =>data => computed => watch
初始化 provide
created
data methods已经能获取 模板还没有编译
被调用后
编译 template模板 生成AST抽象语法树
优化 AST 标记静态节点
根据 AST 生成 render函数(渲染函数)
beforeMount
挂载的对象已经编译好 但页面的DOM树还没挂载上去
被调用完成后
接着拿到上一次 render函数 生成 vnode
对 vnode 进行patch 渲染到DOM节点
mounted
页面已经挂载完成
beforeUpdate
data的数据已经更新 到还没开始渲染DOM树
被调用后
经历一系列的 patch diff 流程后 vnode更新 组件重新渲染
updated
DOM节点被重新渲染
beforeDestory
vue实例还能接着使用
destroyed
所有实例指示的所有东西都会解除绑定,事件监听器也都移除,子实例也被销毁
开始的闪屏
[v-cloak] {
display: none;
}