vue 實現雙向資料繫結的原理就是利用object.defineproperty()方法重新定義了物件獲取屬性值(get)和設定屬性值(set)的操作來實現的。
#簡單實現
var obj = {};
var name;
// 引數一： 定義屬性的物件
// 引數二： 要定義或修改的屬性名稱
// 引數三： 將被定義或修改的屬性描述符
object.defineproperty(obj, "data", {
// 獲取值
get: function() {
return name;
// 設定值
set: function(val) {
name = val;
console.log(val);
//賦值呼叫set
obj.data = "hello";
//取值呼叫get
console.log(obj.data);
vue雙向資料繫結原理
vue應用的是mvvm框架，view和model分離，然後通過vm雙向資料繫結，div 原生物件即資料 var data 建立乙個 viewmodel 例項 var vm new vue 然而乙個動態資料的繫結，是怎麼實現的呢，首先vue利用es5的defineproperty方法裡的get，set...
vue雙向資料繫結原理
text id text show p var text document.getelementbyid text show document.getelementbyid show var model object.defineproperty model,name set function ne...
vue資料雙向繫結原理
vue的資料雙向繫結的小例子 html index.js function selfvue data,el,exp 對data的每一層級的屬性進行監聽，如果變化執行notify observe data 初始化模板資料的值 el.innerhtml this data exp new watcher...