vue雙向資料繫結及其底層原理

什麼式雙向資料繫結

viewmodel對model層進行更新的時候，viewmodel中的binder會自動地把資料更新到view層上去，當使用者操作了view層(例如：表單地輸入)，viewmodel也會自動地把資料更新到model層上。這種方式成為：雙向資料通訊

雙向資料通訊的底層原理

vue在建立例項的時候，會將資料配置到例項中，然後通過object.defineproperty方法，為資料動態的新增getter和setter方法。當獲取資料的時候，會觸發回應的getter方法，當設定資料的時候，會觸發對應的setter方法。setter方法觸發完成的時候，內部會進一步觸發watcher例項，從而資料改變了，檢視層更新操作完畢

object.defineproperty

object.defineproperty是es5中新特性，但是ie8不支援，所以vue是沒有辦法直接應用在ie以下瀏覽器的

Vue渲染原理及其雙向資料繫結詳解

var data var vm new vue function nodetofragment node,vm return frag var dom nodetofragment document.getelementbyid id this function compile node,vm 為匹...

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...