微信小程序wx.showModal模态对话框中content换行
目录
微信小程序wx.showModal模态对话框中content换行
首先wx.showModal()的content是不支持html代码块的。那么怎么在content中换行呢？
解决方案：使用“\r\n”换行
wx.showModal({
title: 'showModal换行',
content: '这是第一行\r\n这是第二行\r\n这是第三行',
success(res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})注意：微信开发者工具上并不会换行只是会有空格，但是实际运行手机上是有换行效果的！
这是微信开发者工具的效果：
这是手机上显示的效果:
如果想要在content里面使用变量，就要使用模板字符串。
const errMes = res.retErr.map(item => item.mes + `\r\n`).join('').slice(0, -4);
wx.showModal({
title: 'showModal换行',
content: `${errMes}`,
success(res) {
if (res.confirm) {
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
.join(’’) 将数组用"“连接成为一个字符串
.slice(0, -4) 截取掉数组最后一项的换行，最后一项不需要换行。
这样就完成了微信小程序wx.showModal模态对话框中content的换行。