• vue3.0的变化


    1.

    vue最主要的特点就是响应式机制、模板、以及对象式的组件声明语法,而3.0对这三部分都做了更改。
    1. 响应式(数据的双向绑定)
    2.0的响应式

      基于Object.defineProperty中的set和get方法实现

      兼容主流浏览器和ie9以上的ie浏览器,

      能够监听数据对象的变化,

      但是监听不到对象属性的增删、数组元素和长度的变化,

      同时会在vue初始化的时候把所有的Observer都建立好,才能观察到数据对象属性的变化。
      3.0的响应式
      采用了ES2015的Proxy来代替Object.defineProperty,
     
      可以做到监听对象属性的增删和数组元素和长度的修改,
     
      还可以监听Map、Set、WeakSet、WeakMap,
     
      同时还实现了惰性的监听,
     
      不会在初始化的时候创建所有的Observer,而是会在用到的时候才去监听。
     
      但是,虽然主流的浏览器都支持Proxy,ie系列却还是不兼容,
      所以针对ie11,vue3.0决定做单独的适配,暴露出来的api一样,但是底层实现还是Object.defineProperty

    2.模板

    模板方面没有大的变更,只改了作用域插槽,

    2.x的机制导致作用域插槽变了,父组件会重新渲染,

    3.0作用域插槽改成了函数的方式,这样只会影响子组件的重新渲染,提升了渲染的性能。 同时,对于render函数的方面,vue3.0也会进行一系列更改来方便习惯直接使用api来生成vdom的开发者。

    3. 对象式的组件声明方式

    vue2.x中的组件是通过声明的方式传入一系列option,和TypeScript的结合需要通过一些装饰器的方式来做,虽然能实现功能,但是比较麻烦。
    
    3.0修改了组件的声明方式,改成了类式的写法这样使得和TypeScript的结合变得很容易。
    
    此外,vue3.0的源码也改用了TypeScript来写。
    其实当代码的功能复杂之后,必须有一个静态类型系统来做一些辅助管理,如React使用的Flow,Angular使用的TypeScript。
    现在vue3.0也全面改用TypeScript来重写了,更是使得对外暴露的api更容易结合TypeScript。静态类型系统对于复杂代码的维护确实很有必要。

    其他的一些东西

    vue3.0的改变是全面的,上面只涉及到主要的3个方面,还有一些其他的更改:
    
    支持自定义渲染器,从而使得weex可以通过自定义渲染器的方式来扩展,而不是直接fork源码来改的方式。
    支持Fragment(多个根节点)和Protal(在dom其他部分渲染组建内容)组件,针对一些特殊的场景做了处理。
    基于treeshaking优化,提供了更多的内置功能




































  • 相关阅读:
    web前端页面性能优化小结
    css3倒影
    jUploader: 基于jQuery文件上传插件
    java 异常的总结
    java 接口
    java 类的成员四初始化块
    java 集合总结
    java 操作集合的工具类Collections
    java 包装类及字符串与基本数据类型间的转换
    单例设计模式
  • 原文地址:https://www.cnblogs.com/SRH151219/p/10397485.html
Copyright © 2020-2023  润新知