LQ博客 www.lqblogs.com
arrows
nav

element-ui之dialog对话框组件title属性无法解析HTML文本的解决方案

作者:LQ 来源:原创 发布时间:2020-01-10 浏览量:7395 评论:0 点赞:3

element-ui之dialog对话框组件title属性,无法解析HTML文本,赋值之后默认为TEXT文本。

如果想实现title属性可以解析HTML文本:
需要使用官网提供的slot狭槽来替换标题内容区,具体实现参考下面代码slot狭槽代码区域。image

<el-dialog :title="activeTitle" :visible.sync="dialogFormVisible" width="60%">
   <div slot="title" class="header-title">
      <span v-html="activeTitle"></span>
   </div>
   <div class="dg-container">
      <div class="dgc-body" v-html="activeContent"></div>
   </div>
</el-dialog>

最终执行结果表明:

当我们使用slot狭槽之后,无论dialog有没有title属性都会被slot狭槽替换掉。

dialog element-ui Vue
如果你感觉本文章对你有帮助的话,那就点赞、打赏或订阅一下吧
点赞(3)
打赏
倒踩(1)
关闭 感谢您的支持,我会继续努力
微信支付
支付宝支付
扫码打赏,建议金额1-20元
浏览量(7395)
讨论本篇文章(0)
发表评论

最多访问文章

最新文章