vue之slot封装组件弹窗

<template>
  <el-dialog :title="title" :visible.sync="dialogVisible" :width="width" center>
    <slot name="content"></slot>
  </el-dialog>
</template>


<script>
export default {
  props: ["title", "width", "dialogVisible"],
  data() {
    return {};
  }
};
</script>

<style lang="less">
.el-dialog__header {
  padding: 20px 20px 10px;
  display: none;
}
.el-dialog__body {
  padding: 0px !important;
}
</style>

 <!-- 弹窗 -->
        <DialogModal :width="'552px'" :title="'加入黑名单'" :dialogVisible="centerDialogVisible">
          <div slot="content" class="popup">
            <div class="head">
              加入黑名单
              <i class="el-icon-close" @click="handelCloseModal()"></i>
            </div>
            <p class="isAdd">确定要讲客户王佳琛加入甄别黑名单？</p>
            <div class="confirm">
              <el-button type="primary">确定</el-button>
              <el-button plain>取消</el-button>
            </div>
          </div>
        </DialogModal>

        <!-- 弹窗 -->