为什么Vue3双向绑定使用Proxy

Vue2
  • 使用Object.defineProperty
  • 无法监听删除属性的操作
  • 需要遍历目标对象的所有属性并加上 setter getter 才能监听
  • 对于对象的新增属性,需要手动监听
  • 在遇到一个对象的属性还是一个对象的情况下,需要递归监听。
  • 对于数组通过push、unshift方法增加的元素,也无法监听
Vue3
  • 使用Proxy双向数据绑定
  • Proxy代理的是整个对象,而不是对象的某个特定属性,不需要我们通过遍历来逐个进行数据绑定。
  • Object.defineProperty中的问题都能解决.
  • Proxy支持13种拦截操作
  • Proxy常常搭配Reflect使用
相关文档

一文搞懂Object.defineProperty和Proxy,Vue3.0为什么采用Proxy?
vue 3.0 Proxy的使用

你可能感兴趣的:(vue.js,前端,javascript)