Vue 数据双向绑定原理

Vuejs双向数据绑定原理:当你把一个普通的 JavaScript 对象传入 Vue 实例作为 

data

Object.defineProperty

Object.defineProperty

下面看一个例子:

   let obj = {};
    let temp = {};
    Object.defineProperty(obj, 'val', {
        get(val) {
            return temp.val;
        },
        set(val) {
            temp.val = val;
            text.innerText = val;
            npt.value = val;
        }
    });
    npt.oninput = function () {
        obj.val = this.value;
    }

text是一个p标签,npt是一个input,这里使用temp变量是为了防止obj变量进入死循环。