Vue.js modal:如何从modal获得响应？

<template>
  <div>
    <!-- 模态框触发按钮 -->
    <button @click="showModal = true">Open Modal</button>

    <!-- 模态框组件 -->
    <modal v-if="showModal" @close="handleModalResponse">
      <p>Are you sure you want to proceed?</p>
      <button @click="confirmAction(true)">Yes</button>
      <button @click="confirmAction(false)">No</button>
    </modal>
  </div>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const showModal = ref(false);

    // 处理模态框的响应
    const handleModalResponse = (confirmed) => {
      if (confirmed) {
        console.log('User confirmed the action.');
        // 执行确认后的操作
      } else {
        console.log('User cancelled the action.');
        // 执行取消后的操作
      }
      // 关闭模态框
      showModal.value = false;
    };

    // 确认或取消操作的回调
    const confirmAction = (confirmed) => {
      handleModalResponse(confirmed);
    };

    return {
      showModal,
      confirmAction
    };
  }
};
</script>

<style>
/* 模态框样式 */
.modal {
  /* 样式代码 */
}
</style>