Vue用了快一年了，一直沒有花時間去了解過它的原理，對於雙向繫結這塊，也只知道在專案中怎麼使用。在網上百度了一波後，發現我有知識都沒接觸過，今天就來好好整理一下。

  我理解的Vue雙向繫結的大致思路如下：

（1）Vue會使用documentfragment劫持根元素裡包含的所有節點（這些節點包括標籤元素、文字、換行的回車等）。

（2）Vue會把data中所有的資料，用definedProperty()變成Vue的訪問器屬性，這樣每次修改這些屬性的時候，就會觸發相應屬性的get,set方法。

（3）編譯處理劫持到的dom節點，遍歷所有節點，根據nodeType來判斷節點型別，根據節點本身的屬性（是否有v-model等屬性）或者文字節點的內容（是否符合{{文字插值}}的格式）來判斷節點是否需要編譯。

（4）對v-model,繫結事件當輸入的時候，改變Vue中的資料。對文字節點，將它作為一個觀察者watcher放入觀察者列表，當Vue資料改變的時候，會有一個主題物件，對列表中的觀察者們釋出改變的訊息，觀察者們更新自己，改變節點中的顯示，從而達到雙向繫結的目的。