mint-ui如何自定义messageBox样式
更新时间:2023年05月16日 14:40:05 作者:laishaojiang
这篇文章主要介绍了mint-ui如何自定义messageBox样式问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
mint-ui自定义messageBox样式
mint-ui MessageBox官网文档:
http://mint-ui.github.io/docs/#/zh-cn2/message-box
- API:

- 里面并没有提供自定义的样式api
里面的内容是默认居中显示的,如果我们想改变里面的样式,比如自定义颜色,字体大小该怎么改的。

- 可以这样:
const html = `
<div style="text-align:left;font-size:20px">
内容内容内容内容内容内容<span style="color:red">我红了</span>
</div>
`
MessageBox ({
title: '标题',
message: html,
confirmButtonText: '我知道了'
})- 结果如下

mint UI messagebox用法
this.$messagebox({
title: '温馨提示',
message: '订单支付成功',
showCancelButton: true,
confirmButtonText:"继续购物",
cancelButtonText:"查看订单"
}).then(action => {
if(action == 'confirm'){
console.log('继续购物')
}else{
console.log('查看订单')
}
})总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
vue中el-checkbox、el-switch绑定值问题详解
这篇文章主要给大家介绍了关于vue中el-checkbox、el-switch绑定值问题的相关资料,文中通过代码介绍的非常详细,对大家学习或者使用vue具有一定的参考借鉴价值,需要的朋友可以参考下2024-01-01
详解Vue2+Echarts实现多种图表数据可视化Dashboard(附源码)
本篇文章主要介绍了详解Vue2+Echarts实现多种图表数据可视化Dashboard(附源码),具有一定的参考价值,感兴趣的小伙伴们可以参考一下。2017-03-03


最新评论