首先，筆者在使用element-ui 中的dialog組件時，發現visible屬性在使用時需要添加.sync才生效，心中好奇，所以研究一下原理
我們先自己創建一個dialog組件，如下
當我們點擊關閉按鈕時，會發生警告
原因就是在VUE中，prop的傳遞是單向下行綁定的，也就是說只能父傳給子，不能反過來。
雖然在demo中子組件直接修改visible也能夠關閉窗口，但是該變量不能傳給父組件，所以並不建議這么做，（如果您任性，覺得父組件拿到這個變量也沒用，那您盡管在子組件中修改，但是小心父組件的入參變化時會覆蓋你的修改）
現在思考，如果我們將子組件的變化告訴父組件，讓父組件幫我們實現是否可行。也就是說我們操作子組件后通知父組件去關閉窗口，答案是可以的
在VUE中，子組件向父組件通信是通過事件完成的，this.$emit
我們點擊子組件關閉按鈕時，調用一下父組件的更新事件，讓父組件在這個更新事件中改變visible這個變量，就可以實現子組件關閉了
.sync這個指令實際上是一個語法糖，在visible屬性變化時會調用父組件的update:visible事件，我們將上面的demo修改如下
在使用該組件時，使用sync與法糖
該語法糖會擴展為
這樣一來，visible就實現了父子同步，父組件初始化visible，子組件調用關閉事件，觸發父組件update事件，父組件在update事件中更新visible變量，改變子組件可見的狀態
我們在實現雙向綁定時經常使用v-modal,這里看來，使用.sync也是可以的，不同在於v-modal觸發的是父組件的input事件，.sync觸發的是父組件的update事件