>[danger]双向数据绑定原理 1. 数据流向 model <-> view  1. 双向数据绑定原理是Object.defineProperty() 首先双向数据绑定一般用于表单标签, 因为只有表单标签才能接收用户的操作 3. 代码如下: ~~~ <div> <p>你的年龄现在: <input id="result" oninput="changeAge(event)"/></p> </div> <script> let model = { age: 18 }; document.getElementById("result").value = model.age; // view->model function changeAge(ev){ model.age = ev.target.value; console.log(model.age); } // model->view (监听model的改变) let v = model['age']; Object.defineProperty(model, "age", { set (val) { v = val; // 重要: 同步更新view, 实现双向数据绑定 document.getElementById("result").value = val; }, get () { return v; } }); // 这次发现, 我们在控制台里修改model.age的值, 页面也同样发生了改变, 证明这次实现了数据的双向绑定 </script> ~~~ 4. 上面代码流程示意图