数据代理

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<!--
数据代理:可以使用其他属性的属性值(通过vm来代理data对象中属性操作)
2.好处:方便操作data中数据
3.原理:通过Obj.defineProperty()把data对象添加vm上
为每一个vm属性添加get和set
在get/set内部进行读写的操作


-->


<script src="../vue/vue.js"></script>
</head>
<body>
<div id="p">
<p>姓名:{{name}}</p>
<p>年龄:{{age}}</p>
</div>
<script>
// let obj = {x:100}
// let obj1 = {y:200}
// Object.defineProperty(obj1,'x',{
// get(){
// return obj.x
// },
// set(value){
// obj.x = value
// }

// })


var vm = new Vue({
el : "#p",
data : {
name : '魏世轩',
age : '20',
}

});



</script>
</body>
</html>

posted on 2022-10-31 09:39  爱前端的小魏  阅读(36)  评论(0编辑  收藏  举报

导航