子(對話窗)
<div>
<v-row justify-end>
<v-btn icon dark @click="close" class="mt-10" color="teal"> <v-icon>mdi-close</v-icon> </v-btn>
</v-row>
</div>
methods: {
close() {
this.$emit('closeRegist');
},
}
父(頁面)
<v-dialog persistent v-model="RegistDialoge" >
<v-card > >
<register @closeRegist="closeRegistDialog"></register>
</v-card>
</v-dialog>
RegistDialoge: false,
methods: {
closeRegistDialog() {
this.RegistDialoge = false;
},
}
原理是:當子元件的按鈕被觸發(想要關掉對話窗)時，會對父元件出發$emit('closeRegist');，項父元件申請說[子元件提出這個事項]，父元件就會去[找到@closeRegist這個事項]，並執行觸發事件closeRegistDialog(關掉對話窗)，任務完成。