vue中sync修飾符怎么用

1. 是事件名
2. 更換當(dāng)前的bar屬性值為傳過來的值
3. 對
4. 等同于上面的操作

正常來說，vue2是不允許子組件直接改父組件傳進(jìn)去的值的。
關(guān)于vue的數(shù)據(jù)傳遞可以看這個
所以我們需要在子組件內(nèi)定義自定義事件，通知父組件需要改值了。

// 父
<template>
    //    傳入val props  綁定事件change
    <child :foo="val1" @update:foo="changeVal">
</template>
methods:{
    changeVal(val) {
        this.val1 = val
    }
}
//子
在某個操作中觸發(fā)被綁定的change事件，通知父組件修改
this.$emit('update:foo', 'newVal')

那么使用sync修飾符，就是簡化了這一過程,
父組件直接這么寫就行了，子組件還是需要觸發(fā)的

<template>
    //    傳入val props，使用sync修飾符  不用綁定事件change
    <child :foo.sync="val1">
    // 也不用定義method了
</template>

語法糖就是這個意思，讓你少寫代碼的。

val=>bar=val這是箭頭函數(shù)

function (val) {
    this.bar = val
    // 在vue的表達(dá)式里不用this
    // 即 bar = val
}