Vue中的数据绑定以及双向绑定原理

1. Vue中有2中数据绑定的方式：

一种是单向绑定，一种是双向绑定。
(1). v-bind 单向绑定，数据只能从data流向页面

vue <h3 v-text="nn"></h3> <h3 v-html="ss"></h3>

(2). v-model 双向绑定，数据能从data流向页面，也能从页面流向data，双向绑定只能用于有value值得标签，v-model默认就是获取value值，所以v-model:value可以简写成v-model

<input type="text" v-model="n1">

2. 双向绑定的原理：

    利用Object.defineProperty方法，其中用get()来获取对象属性数据，把获取的数据利用新的属性名装起来，然后用set()调用改值来监听设置修改，当内容被修改时就会触发，并且把修改的值赋值给原来的属性名。

 Object.defineProperty(obj,'age',{
    // value:18,  //这样添加的属性不可枚举（无法遍历）
    // configurable:'true', //控制属性是否可删除
    // enumerable:true,  //该属性控制是否可枚举性
    // writable:true, //控制属性是否可修改
    
    // 获取
    get(){
        console.log("你访问了obj对象的age属性");
        return value=num
    },
    // 监听设置修改
    set(value){
        console.log("你修改了age的值，值是",value);
        num=value
    }