vue中设置属性自己的理解

var person= {};
var temp = [];
Object.defineProperty(person, ‘name’, {
set: function(newVal) {
temp[‘name’] = newVal;
console.log(‘为person设置新的姓名:’ + newVal);
},
get: function() {
var _name = temp[‘name’] || ‘默认姓名’;
console.log(‘获取person的姓名:’ + _name);
return _name;
}
});
JS中设置属性会调用这个方法,且不兼容IE8以下的版本;
比如组件中需要取得list.name的值时,或者改变时会调用上面的方法Object.defineProperty方法,要设置还是要取值时,都能达到监听的效果,实现双向绑定,来个具体的v-model的例子

<input v-model="msg" type="text">
<!-- 当文本输入时,可用input/keyup等事件将input的value的值传递给msg(视图层数据改变传给数据层),当数据层改变通过object.defineProperty调用,再传给input的value值,达到数据层传给视图层,做到了双向绑定 -->
发布了9 篇原创文章 · 获赞 2 · 访问量 3355

猜你喜欢

转载自blog.csdn.net/weixin_42890213/article/details/88018555