• Vue 生命周期


    1, 实例,组建通过new Vue() 创造出来之后,会初始化事件和生命周期(init Events & LifeCycle),然后会执行beforeCreate钩子函数,这个时候,数据还没有加载,所以不能访问到数据和真实的DOM,一般不做操作。

    2,加载数据,绑定事件(init Injections & Reactivity ), 然后执行created 函数,这个时候已经可以获取到数据,做修改也不会触发updated 函数(倒数第二次做修改也不会触发updated函数),所以一般做数据的初始化。

    3,找到组建,实例以及其对应的模板,compile template => 虚拟的DOM,准备放入到render 函数中进行渲染,然后执行beforeMount 函数,在beforeMount 函数中,虚拟的DOM已经创建完成,马上要开始渲染,此时做数据的修改也不会调用其它钩子函数,(最后一次渲染前做数据的修改),这里一般也是可以做数据的初始化。

    4,然后就是执行render 函数,渲染出真实的DOM,执行mounted 钩子函数,所有的数据全部挂载,DOM 元素已经渲染在页面中,此时可以操作真实的DOM。

    5,当实例或者组建发生变化之后,会立刻执行beforeUpdate 函数,虚拟DOM 会与上一次的虚拟DOM 进行diff 比较,然后重新渲染。

    6,数据完成更新之后,会执行update 函数,数据更改,重新render,重新可以操作DOM。

    7,当经过某种途径调用$destroy方法后,立即执行beforeDestroy,一般在这里做一些善后工作,例如清除计时器、清除非指令绑定的事件等等。

    8,组件的数据绑定、监听...去掉后只剩下dom空壳,这个时候,执行destroyed,在这里做善后工作也可以。

    Vue 的生命周期共有8个阶段,创建前后,载入前后,更新前后,销毁前后

  • 相关阅读:
    最近比较毁硬件
    如何编写 Visual C++ 的表达式分析插件
    Windows 安全性编程
    MMX写的memcpy测试
    今天终于摆平了DeskBand
    ASP.NET后台代码调用前台javascript脚本的方法
    ArcGIS Server 9.3前后台交互调用实现点定位
    Oracle中建立存储过程
    建表时自动增加oracle表中记录的ID值
    特定图层的渲染
  • 原文地址:https://www.cnblogs.com/pickKnow/p/10472146.html
Copyright © 2020-2023  润新知