背景:我们在项目中使用Mint-UI时,可以使用里面的组件,但有时需要对组件进行修改或者自定义,或者动态传值,此时就需要使用模板字符串了。
一、如何使用模板字符串进行自定义样式修改
var htmls = `
<div class="box">
<div class="isunbind" style="text-align:left;">可用于购买本产品的医保个人账户额度为${this.lnzhyeMoney}元,您的医保可用额度不足以全额抵扣保费,需全额个人支付。</div>
</div>
`;
MessageBox.alert('',{
message:htmls,
title:'温馨提示',
})
这样,可以通过自定义div修改弹框里面的样式,这个例子使原本组件中居中显示的文件,修改成了左对齐的样式。
二、 如何使用模板字符串解决动态传值问题
MessageBox.alert('可用于购买本产品的医保个人账户额度为'+`${this.lnzhyeMoney}`+元,您的医保可用额度不足以全额抵扣保费,需全额个人支付。','温馨提示');
这样,通过模板字符串解决了弹框中,动态传值的问题。