我有一個名為 customize-charts 的組件,其中包含一個 Vuetify 抽屜:<template> <v-col> <v-btn style="float: right" class="mr-4 mt-2" small @click="toggleCustomize" v-if="!open">Customize Dashboard</v-btn> <v-navigation-drawer v-model="open" temporary absolute right style="width: 25vw" > <span>draw contents</span> <v-divider /> </v-navigation-drawer> </v-col></template><script>export default { props: { data: { type: Array, default () { return [] } }, open: { type: Boolean, default () { return false } } }, data () { return { draggingItem: null } }, methods: { toggleCustomize () { this.$emit('open') } }}</script>如您所見,抽屜正在監聽的布爾值稱為“打開”,它是從父級傳遞的: <customize-charts v-if="chartCards.length" :data="chartCards" :open="customizePanel" @updateorder="updateOrder" @toggleshow="toggleShow" @open="customizePanel=!customizePanel"/> 父母還有以下內容:{ data () { return { customizePanel: false, } }} 我的問題是,當open調用自定義事件 (@open="customizePanel=!customizePanel") 時,抽屜會打開,但當它關閉時(用戶在抽屜外單擊)它不會設置為customizePanelfalse。我怎樣才能做到這一點?
為什么這個子事件不在父級(Vue)中更新狀態
一只甜甜圈
2023-03-03 13:12:13