在一些情況下，我們可能會需要對一個 prop （父子組件傳遞數據的屬性） 進行“雙向綁定”。 在vue 1.x 中的 .sync 修飾符所提供的功能。當一個子組件改變了一個帶 .sync 的prop的值時，這個變化也會同步到父組件中所綁定的值。 這很方便，但也會導致問題，因為它破壞了單向數據流。（數 ...
在一些情況下，我們可能會需要對一個 prop （父子組件傳遞數據的屬性） 進行“雙向綁定”。
在vue 1.x 中的 .sync 修飾符所提供的功能。當一個子組件改變了一個帶 .sync 的prop的值時，這個變化也會同步到父組件中所綁定的值。
這很方便，但也會導致問題，因為它破壞了單向數據流。（數據自上而下流，事件自下而上走）
由於子組件改變 prop 的代碼和普通的狀體改動代碼毫無區別，所以當你光看子組件的代碼時，你完全不知道它合適悄悄地改變了父組件的狀態。
這在 debug 複雜結構的應用時會帶來很高的維護成本。於是我們在 vue 2.0 中移除了 .sync 。
但是在實際應用中，我們發現 .sync 還是有其適用之處的，比如在開發可復用的組件庫時。（懵逼○△○）
我們需要做的只是 讓子組件改變父組件狀態的代碼更容易被區分。
於是從 vue 2.3.0 開始，我們重新引入了 .sync 修飾符，但是這次它只是作為一個編譯時的語法糖存在。他會被自動擴展為一個 自動更新父組件屬性的 v-on 監聽器。
例如：
<child :foo.sync=”msg”></child> 就會被擴展為： <child :foo=”bar” @update:foo=”val => bar = val”> （@是v-on的簡寫）
當子組件需要更新 foo 的值的時候，他需要顯示的觸發一個更新事件： this.$emit( “update:foo”, newValue );
初始狀態：
點擊之後的狀態：
原理就是父組件向子組件傳遞了一個函數：function (newValue) { this.msg = newValue; }
當使用一個對象一次性設置多個屬性的時候，這個 .sync 修飾符也可以和 v-bind 一起使用。
例如： <child v-bind.sync = “{ message: msg, uC: uc}”></child> (不能寫成 :.sync="{*********}"，否則會報錯的)
這個例子會為 message 和 uC 同時添加用於更新的 v-on 監聽器。
我不知道這是什麼原因，可能是我弄錯了，希望成功的兄弟可以告訴我一下，非常感謝 ^_^
