BasicModal 弹窗扩展 #

<template>
    <n-button type="primary" @click="showModal">打开Modal</n-button>
    <basicModal @register="modalRegister" ref="modalRef" class="basicModal" @on-ok="okModal">
        <template #default>
            <p>我是弹窗内容</p>
        </template>
    </basicModal>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { basicModal, useModal } from '@/components/Modal';
export default defineComponent({
    components: { basicModal },
    setup() {
        const [modalRegister, { openModal, closeModal }] = useModal({
            title: '新增预约',
        });

        async function okModal() {
           closeModal();
        }

        function showModal() {
            openModal();
        }
        
        return {
            modalRegister,
            okModal,
            showModal
        }
    }
})
</script>