我如何使用离子模态控制器捕捉模态this。$ emit

时间:2019-07-18 15:46:12

标签: vue.js ionic-framework ionic-vue

您好,我正在将自己的Web代码的一部分转换为ionic-vue应用程序,我想知道是否可以使用经典vuecomponent所安装的离子模式控制器从我的模式中捕获this.emit。

基本上我想翻译

$i = 0;
foreach($product_variants as &$value){
    foreach($value as &$values){
        $values['image_number'] = $i++;
    }
}

<NewAppointmentModal @onSuccess="handleAppointmentCreation"/>

2 个答案:

答案 0 :(得分:4)

<块引用>

Brian 回答正确,但 Vue 3 中的代码行发生了变化:ParentComponent.vue

 this.$on('close', () => {
       this.$ionic.modalController.dismiss()
   })

答案 1 :(得分:2)

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>