我如何使用离子模态控制器捕获模态 this.$emit
How can i catch a modal this.$emit using ionic modal controller
你好,我正在将我的一些 Web 代码转换为 ionic-vue 应用程序,我想知道我们是否可以使用经典 vue 组件的离子模态控制器从我的模态中捕获 this.$emit。
基本上我想翻译
<NewAppointmentModal @onSuccess="handleAppointmentCreation"/>
至
this.$ionic.modalController.create({ component: NewAppointmentModal}).then(m => m.present())
//how can i catch the onSuccess event like before
ParentComponent.vue
public openModal() {
return this.$ionic.modalController
.create({
component: ModalComponent,
componentProps: {
data: {
content: 'New Content',
},
propsData: {
//user_id: user_id
},
parent: this,
},
})
.then(m => m.present({
}))
}
public mounted() {
this.$on('close', (foo) => {
this.$ionic.modalController.dismiss()
})
}
ModalComponent.vue
<template>
<ion-button @click="dismissModal()">Close</ion-button>
</template>
<script>
dismissModal() {
this.$parent.$emit('close', { foo: 'bar' })
}
</script>
Brian answered correct, but there are a code line change in Vue 3: ParentComponent.vue
this.$on('close', () => {
this.$ionic.modalController.dismiss()
})