lovecoding
/
VIP26


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div id="app">
      <!--
            什么叫数据代理？
            Object.defineProperty
            通过一个对象去代理另一个对象并对其属性进行（读/写）的操作；
          -->
          <!-- {{newMain}} -->
    </div>
    <script src="./vue.js"></script>
    <script>
      // let obj = {
      //     name: 'LiLi',
      //     age: 18
      // }
      // 参数一：需要设置或添加属性的对象
      // 参数二： 需要设置或添加属性的值
      // 参数三：配置对象
      // Object.defineProperty(obj,'sex',{
      //     value:'女'
      // })
      // console.log(obj,'obj')
      // var app = new Vue({
      //     el:"#app",
      //     data:{

      //     }
      // })
       var app = new Vue({
        el:"#app",
        data:{
            num: 10,
            obj:{
                name:"张振博",sex:"男"
            }
        },
        //     let num = 10; 
        //   let obj = {name:"张振博",sex:"男"}; 
        //   Object.defineProperty(obj,'age',{
        //     get(){
        //         console.log("读取"); 
        //         return num
        //     },
        //     set(value) {
        //         console.log("设置");
        //         num = value;
        //     }
        //    })
        // let obj = {};
        // let obj1 = {
        //     name: "李兆龙",
        //     age: 18
        // }
        // Object.defineProperty(obj,'age',{
        //     get() {
        //         console.log("走到获取里");
        //         return obj1.age;
        //     },
        //     set(value) {
        //         obj1.age = value
        //     }
        // })
        // console.log(obj)
       })
    </script>
  </body>
</html>