五一假期在家補了課，看到雙向繫結與單向資料流的概念。瓦特，我之前以為vue的v-model就是雙向資料流，其實不然,下面讓我仔細來看看
雙向繫結
簡而言之，雙向繫結就是model的更新會觸發view的更新，view的更新會觸發model的更新，它們的作用是相互的
[上傳失敗...(image-81a06f-1556975918443)]
單向資料流
簡而言之，單向資料流就是model的更新會觸發view的更新，view的更新不會觸發model的更新，它們的作用是單向的
單向資料流
這不是廢話嗎，誰都知道的
下面就是真正的乾貨了，板凳坐好
v-model的實現原理
放在元件上
父元件子元件
:value="phoneinfo.phone"
type="number"
placeholder="手機號"
@input="handlephonechange"
:value="zipcode"
type="number"
placeholder="郵編"
@input="handlezipcodechange"
export default "
以上兩句是相等的
tips
model 2.2.0+
允許乙個自定義元件在使用 v-model 時定製 prop 和 event。預設情況下，乙個元件上的 v-model 會把 value 用作 prop 且把 input 用作 event，但是一些輸入型別比如單選框和核取方塊按鈕可能想使用 value prop 來達到不同的目的。使用 model 選項可以迴避這些情況產生的衝突。
在有些情況下，我們可能需要對乙個 prop 進行「雙向繫結」。不幸的是，真正的雙向繫結會帶來維護上的問題，因為子元件可以修改父元件，且在父元件和子元件都沒有明顯的改動**。
總結所以說呢， vue還是單向資料流，v-model只不過是語法糖，它是:value="sth"和@change="val => sth = val"的簡寫形式。我們通常在面試當中被提問，vue是怎麼實現資料響應式更新的，面試官期望聽到的回答是通過object.defineproperty()的get和set方法來實現響應式更新。
v-model和.sync修飾符分別在元件單個屬性、多個屬性需要雙向繫結下使用，這是二者使用的場景
vue 單相繫結 Vue的單向繫結和雙向繫結
1 單向繫結 單向資料繫結的實現思路 所有資料只有乙份 一旦資料變化，就去更新頁面 只有data dom，沒有dom data 若使用者在頁面上做了更新，就手動收集 雙向繫結是自動收集 合併到原有的資料中。單項繫結 如下 html 2 雙向繫結 資料的雙向繫結是vue實現的一大功能。使用v mode...
Vue雙向繫結
把乙個普通物件 a 傳給 vue 例項作為它的 data 選項，vue.js 將遍歷它的屬性，用object.defineproperty 將它們轉為 getter setter,如圖綠色的部分所示。每次使用者更改data裡的資料的時候，比如a.b 1，setter就會重新通知watcher進行變動...
Vue 雙向繫結
在react或者vue這類mvvm框架中使用雙向繫結是很常見的需求，最近專案中在使用vue，今天來談一談vue中雙向繫結的實現。先來說幾句廢話 什麼是雙向繫結？把model中的資料繫結到view中，然後更新model時view會自動跟新，這叫單向繫結，而當使用者改變view時model中資料也能自動...