vue3 + ts 开发的弹窗组件

练习项目 Dialog

使用

import DbDialog from "db-dialog";

DbDialog({
    title: "提示",
    html: '<div>这是一段<span style="color: red;">html</span>代码</div>',
    confirmText: "我知道了",
    cancelText: "我要取消",
    async: true,
    confirm: (done: Function, loading: Ref<boolean>) => {
        console.log("确认");
        setTimeout(() => {
            loading.value = false;
            done();
        }, 3000);
    },
    cancel: () => {
        console.log("取消");
    },
});

api

// 标题
title?: string;
// 文本内容
message?: string;
// 富文本内容
html?: string;
// 自定义确认按钮文案
confirmText?: string;
// 自定义取消按钮文案
cancelText?: string;
// 是否开启异步请求
async?: boolean;
// 确认按钮事件
confirm?: (done: Function, loading: Ref<boolean>) => void;
// 取消按钮事件
cancel?: () => void;