Vuejs2 VueJs+；元素UI：如何自定义el对话框标题？

我使用el图标创建了一个带有自定义el对话框标题的对话框，但是el图标没有出现。 如何使图标出现

这是我的密码

<el-dialog :title="titleData" :visible.sync="dialogVisible" width="30%">
  <span>This is a message</span>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">Cancel</el-button>
    <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
  </span>
</el-dialog>

methods: {
  setTitle() {
  this.titleData = '<el-icon-info></el-icon-info>' + 'Info'
}

这是一条信息
取消
证实
方法：{
setTitle（）{
this.titleData=''+'信息'
}

---

这是我的小提琴：

只需使用

el对话框

组件上可用的插槽

标题

。这是用工作解决方案更新的小提琴：

只需使用

el对话框

组件上可用的插槽

标题

。这是用工作解决方案更新的小提琴：

插槽 -：对话框的内容

标题：对话框标题的内容

页脚：对话框页脚的内容

<el-dialog :visible.sync="dialogVisible" width="30%">
  <span slot="title"><el-icon-info></el-icon-info>Info</span>
  <span>This is a message</span>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">Cancel</el-button>
    <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
  </span>
</el-dialog>

信息
这是一条信息
取消
证实

Slot -：对话框的内容

标题：对话框标题的内容

页脚：对话框页脚的内容

<el-dialog :visible.sync="dialogVisible" width="30%">
  <span slot="title"><el-icon-info></el-icon-info>Info</span>
  <span>This is a message</span>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">Cancel</el-button>
    <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
  </span>
</el-dialog>

信息
这是一条信息
取消
证实