1. 程式人生 > >vue2.0修飾符sync用法

vue2.0修飾符sync用法

rop methods 修飾符 false lean -s syn upd ble

如果子組件是一個彈窗,我們想通過點擊關閉按鈕來關閉子組件彈窗,子組件彈窗的v-show由變量isVisible控制,這個變量通過props由父組件來註入,

而子組件無法改變props裏面的變量的值,但可以通過sync修飾來實現,代碼如下:

子組件:

<button @click="close">關閉</button>

    export default {
        props: {
            isVisible: {
                type: Boolean,
                default: false
} }, methods: { close () { this.$emit(‘update:isVisible‘, false); } } };

父組件:

<chlid-component :isVisible.sync="isVisible"></chlid-component>

vue2.0修飾符sync用法