[Vuejs]-Can't close custom modal that is based on a-modal

by

0👍

✅

I solved this problem like below.

  • App.vue
<template>
:

<custom-modal :visible="true" @cancel="handleCancel">
   <a-modal-item>Custom Modal</a-modal-item>
</custom-modal>

:
</template>
<script>

methods: {
  handleCancel: {
    alert('Do what you want before close modal')
  }
}
:

</script>
  • CustomModal.vue

<template>
  <a-modal v-bind="$attrs" @cancel="handleCancel">
    <slot/>
  </a-modal>
</template>

<script>
export default {
  methods: {
    handleCancel() {
      this.$emit("cancel");
    }
  }
};
</script>

Leave a comment