vue源码学习之Object.defineProperty对象属性监听
本文介绍了vue源码学习之Object.defineProperty对象属性监听,分享给大家,具体如下: 参考版本 vue源码版本:0.11 相关vue实现双向数据绑定的关键是 Object.defineProperty ,让我们先来看下这个函数。 在MDN上查看有关Object.defineProperty 的解释。 我们先从最简单的开始: a.b = 2; // b被修改,新b=2
a.b; // b被访问 这样,我们就能监听对象了!但问题并不仅仅这么简单。。。 我们可能会有对象中属性的值还是对象这种嵌套情况,可以通过递归解决! 在vue源代码文件 srcobserveobserver.js 中 let p = Observer.prototype;
p.walk = function(obj){ let val; for(let key in obj){ // 通过 hasOwnProperty 过滤掉一个对象本身拥有的属性 if(obj.hasOwnProperty(key)){ val = obj[key]; // 递归调用 循环所有对象出来 if(typeof val === 'object'){ new Observer(val); } this.convert(key,val); } } }; p.convert = function(key,val){ let data = { let app = new Observer(data); 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |