美文网首页
vue 生命周期理解

vue 生命周期理解

作者: 九仄 | 来源:发表于2020-12-01 15:05 被阅读0次

    vue优点
    1. 轻量级框架:只关注视图层,是一个构建数据的视图集合,大小只有几十kb;
    2. 简单易学:国人开发,中文文档,不存在语言障碍,易于理解和学习;
    3. 双向数据绑定:保留angular特点,在数据操作方面更为简单;
    4. 组件化:保留react的优点,实现html的封装和重用,在单页面应用方面有独特的优势;
    4. 视图,数据结构分离:使数据更改更为简单,不需要进行逻辑代码修改,只需要操作数据就能完成相关操作;
    6. 虚拟DOM:dom操作是非常消耗性能的,不再使用原生的dom操作节点,极大解放dom操作,但具体操作还是dom,只不过换了一种方式;
    7. 运行速度更快:相比较与react而言,同样是操作虚拟dom,就性能而言,vue存在很大的优势。

    请详细说下你对vue生命周期的理解?

      总共分为8个阶段创建前/后,载入前/后,更新前/后,销毁前/后。
    

    创建前/后: 在beforeCreate阶段,vue实例的挂载元素el和数据对象data都为undefined,还未初始化。在created阶段,vue实例的数据对象data有了,el为undefined,还未初始化。

    载入前/后:在beforeMount阶段,vue实例的$el和data都初始化了,但还是挂载之前为虚拟的dom节点,data.message还未替换。在mounted阶段,vue实例挂载完成,data.message成功渲染。

    更新前/后:当data变化时,会触发beforeUpdate和updated方法

    销毁前/后:在执行destroy方法后,对data的改变不会再触发周期函数,说明此时vue实例已经解除了事件监听以及和dom的绑定,但是dom结构依然存在

    相关文章

      网友评论

          本文标题:vue 生命周期理解

          本文链接:https://www.haomeiwen.com/subject/xhjswktx.html