Proxy监听对象的数据变化,处理绑定数据很有用

Posted 刘金宇

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Proxy监听对象的数据变化,处理绑定数据很有用相关的知识,希望对你有一定的参考价值。

Proxy可以监听对象身上发生了什么事情,并在这些事情发生后执行一些相应的操作。一下子让我们对一个对象有了很强的追踪能力,同时在数据绑定方面也很有用处。


var peo = { name: zhangsan, salary: 27 };
//interceptor 拦截
var interceptor = {
  set: function (recObj, key, value) {
    console.log(key, is changed to, value); //name is changed to lisi
    recObj[key] = value;
  }
};
//创建代理以进行侦听
proxyEngineer = new Proxy(peo, interceptor);
//做一些改动来触发代理
proxyEngineer.name = lisi;//控制台输出:salary is changed to 60
console.log(peo) //{name: "lisi", salary: 27}

 

以上是关于Proxy监听对象的数据变化,处理绑定数据很有用的主要内容,如果未能解决你的问题,请参考以下文章

Proxy(vue响应式原理:数据侦测--数据劫持和数据代理)

vue的数据双向绑定是怎么实现的

vue 如何在循环中 "监听" 的绑定v-model数据

Vue的双向数据绑定原理

vue中如何监听vuex中的数据变化

学习 vue2.0/3.0 中的proxy和Object.defineProperty 小记