elementUI给dialog标题添加icon图标

1,401 阅读1分钟

利用插槽slot给dialog标题添加icon图标

  <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
    <div slot="title" class="header-title">
      <span class="title-name">
        <i class="el-icon-warning" style="color: #e6a23c;margin-right:10px"></i>
      </span>
      <span class="title-age">提示</span>
    </div>
    <span>这是一段信息</span>
    <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>

icon: el-icon-warning

image.png

效果如图:

image.png