vue+element的confirm提示消息文字变色和换行

效果:

思路:

可以考虑采用模板字符串的思路实现

代码:

 this.confirm(`您确定要<b style="Color: red">${text}</b>的数据项?<br/>单位名称: ${row.companyName} <br/>属性: ${row.attributeName}`)
        .then(() => {
            console.log('确定');
            })
        .catch(() => {
            console.log('取消');
        })

还可以配置本地图片图标

  this.$confirm(`<img src="${require('@/assets/images/newImages/shanchutishi.png')}" alt class="containerleftimg" style="width: 36px; height: 36px; margin-right: 20px;"/>请确认是否删除该稀产品, 此操作不可逆?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          dangerouslyUseHTMLString: true   // 关键配置,允许解析HTML
        }).then(() => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });          
        });

注意这个配置项:   dangerouslyUseHTMLString: true   // 关键配置,允许解析HTML

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值