当前位置:   article > 正文

element ui中el-dialog如何自定义标题,加图标_el-dialog自定义title

el-dialog自定义title

效果图:
在这里插入图片描述

   <el-dialog
  title="提示"
  :visible.sync="dialogVisible"
  width="30%"
  :before-close="handleClose">
  <div slot="title" class="dialog-title">
    <i class="el-icon-warning"></i>
    <span class="title-text">数据详情</span>
    <div class="button-right">
      <span class="title-close" @click="cancel"></span>
    </div>
  </div>

  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
  </span>
</el-dialog>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家小花儿/article/detail/86078
推荐阅读