sync 簡單實現父子元件的雙向繫結

這裡主要是對vue文件中的sync進行乙個再解釋：

如果自己嘗試的話，最好在已經使用emit 和prop實現了雙向繫結的元件中嘗試，以免出現不必要的錯誤；


你的名字：}

第一步：將子元件的emit事件修改為update形式

在有些情況下，我們可能需要對乙個 prop 進行「雙向繫結」。不幸的是，真正的雙向繫結會帶來維護上的問題，因為子元件可以修改父元件，且在父元件和子元件都沒有明顯的改動**。

這也是為什麼我們推薦以update:mypropname的模式觸發事件取而代之。

this.$emit('update:title', newtitle)

emit都知道是子元件向父元件派發事件；從update:mypropname我們可以得知 update：後的值是不固定的；

第二步：改變父元件的v-bind

然後父元件可以監聽那個事件並根據需要更新乙個本地的資料屬性。例如：

document
v-bind:title="doc.title"v-on:update:title="doc.title = $event"
>
在父元件中，v-bind:後的值title也是不固定的，而=後的「doc.title」則是父元件中存在的本地資料

為了方便起見，我們為這種模式提供乙個縮寫，即.sync修飾符：

簡寫

注意帶有.sync修飾符的v-bind不能和表示式一起使用 (例如v-bind:title.sync=」doc.title + 『!』」是無效的)。取而代之的是，你只能提供你想要繫結的屬性名，類似v-model。

如果子元件派發出來的事件，需要經過表示式的改寫（如取反之類的）都無法使用sync；你可以使用比較好用的 emit 和prop來實現雙向繫結

你的名字：}

子元件向父元件傳參父元件只要子元件發生變化就會呼叫handle函式觸發,然後把handle這個函式的資料更新成自己的資料 methods 子元件 methods sync資料修飾符父元件向子元件傳遞資料方法一父元件 data v bind強制繫結資料,子元件只能讀取,不能修改,如果子元件想...

我們知道，在vue的元件通訊props中，一般情況下，資料都是單向的，即父元件資料的更改會下傳到子元件用了.once除外子元件對資料無法做出更改當傳遞的資料是引用資料型別時，可以更改父元件資料，比如，陣列的破壞性方法，push等在vue1.x時，提供.sync作為雙向傳遞的關鍵字，但是2.0...

產生原因父組建向子組建傳值是通過props傳遞值，由於props是單向資料流，所以子組建需要向父組建更新資料時無法傳遞，此時，這時候就需要用到如下方法父組建正常傳遞資料 data myinput sync傳遞資料 data myinput 子組建子組建正常使用props引入資料 props ...

sync 簡單實現 父子元件的雙向繫結