vue实例的声明周期

new Vue()html

建立实例node

    ↓react

初始化事件和生命周期算法

    ↓app

beforeCreatedom

    ↓spa

初始化injection和reactivityhtm

    ↓生命周期

created事件

    ↓

有没有“el”选项,没有等待vm.$mount(el)调用,有则往下

    ↓

有没有template选项?有的话把template编译成render function,没有的话把外部el挂载点的html看成模板

    ↓

beforeMount

    ↓

执行render function,#el的内容挂载到dom中

    ↓

mounted

 

当data发生改变时,先触发beforeUpdate再从新渲染虚拟 dom,并经过 diff 算法对比 vnode 节点差别更新真实,最后触发updated

组件销毁的时候(能够经过调用app.$destroy()模拟),先触发beforeDestroy,销毁数据监听,子组件和解除事件监听,最后触发Destroyed(实例销毁后虽然 dom 和属性方法都还存在,但改变他们都将再也不生效)

renderError rander方法异常的时候会触发(开发环境)

errorCaptured  render方法异常的时候会触发(能够向上冒泡,生产环境也试用)

相关文章
相关标签/搜索