使用 object.defineproperty 進行資料劫持,把 data 物件、computed 等裡的所有屬性進行資料劫持
使用觀察者模式,完成發布訂閱。
模板裡使用 data 物件屬性的 dom 物件都訂閱
當 data 物件裡面的屬性的值發生變化時,就會發布,發布時就改變了 dom 裡的內容
偵測資料的變化 → 收集檢視依賴了哪些資料 → 資料變化時,自動「同質化」需要更新的檢視部分,並更新;
對應專業術語:資料劫持/資料** → 依賴收集 → 發布訂閱模式
js偵測物件變化: object.defineproperty(設定物件屬性 setter/getter 監聽)、es6 的 proxy
訂閱者 dep → 收集、刪除、向 依賴傳送訊息等
觀察者 watch → 觀察訂閱依賴
vue雙向繫結原理
大家知道vue的雙向繫結原理是利用object.defineproperty 這一方法,以下是我研究該方法的一些內容 語法 object.defineproperty obj,prop,descriptor descriptor是將被定義或修改的屬性描述符,而雙向繫結是利用get和set屬性描述符。...
Vue雙向繫結原理
vue實現資料雙向繫結的原理就是用object.defineproperty 重新定義 set方法 物件設定屬性值和 get方法 獲取屬性值的操縱來實現的 object.property 方法的解釋 object.property 引數1,引數2,引數3 返回值為該物件obj 其中引數1為該物件 o...
vue雙向繫結原理
vue資料雙向繫結是通過資料劫持結合發布者 訂閱者模式來實現的。首先要對資料進行劫持監聽,所以需要設定乙個 observer,用來監聽所有的屬性。如果屬性發生了變化,就要告訴訂閱者watcher看是否需要更新,因為訂閱者很多,所以我們需要有乙個訊息訂閱器容器dep專門收集訂閱者,然後在 observ...