vue封装diolog框

最新推荐文章于 2023-09-25 14:23:31 发布

Lpd_Reason

最新推荐文章于 2023-09-25 14:23:31 发布

阅读量316

点赞数

分类专栏：前端框架vue

本文链接：https://blog.youkuaiyun.com/qq_40283784/article/details/108519684

版权

本文介绍如何在Vue.js应用中进行对话框组件的封装，包括调用方式及其实现过程，帮助开发者提高代码复用性和项目效率。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

static dialog(component, dialogOptions = null, componentProps = null) {
    return new Promise((resolve, reject) => {
      let options = Object.assign(
        {
          title: "",
          width: "50%",
          customClass: "",
          btnClose: true
        },
        dialogOptions
      );
      let componentOptionHtml = "";
      if (componentProps && typeof componentProps === "object") {
        for (let key in componentProps) {
          componentOptionHtml += `:${key}="${key}" `;
        }
      }
      let template = `<el-dialog :title="$t(options.title)" :class="options.class" :width="options.width" :visible.sync="dialogVisible" :close-on-click-modal="false" @closed="closed()" :show-close="options.btnClose" :custom-class="options.customClass