作者：手机用户2502856237 | 来源：互联网 | 2023-06-08 14:56
1、搜索关键词vue提示this.$message换行vue提示this.$message设置样式vue字符串替换（因为在提示框中要显示的是录入生成的参数（json形式），需要粘贴出来给xxljob系统作为任务调度的入参，所以觉得设置换行会友好一点，而且监控项目原生的this,message提示只有一行并且显示不全，相当之不友好）。2、vue字符串替换vue把字符串的所有替换成&
1、搜索关键词
vue提示this.$message换行
vue提示this.$message设置样式
vue字符串替换（因为在提示框中要显示的是录入生成的参数（json形式），需要粘贴出来给xxljob系统作为任务调度的入参，所以觉得设置换行会友好一点，而且监控项目原生的this,message提示只有一行并且显示不全，相当之不友好）。
2、vue字符串替换
vue 把字符串的所有=替换成&&&的方法
//把字符串中所有=换成&&&
let reg=new RegExp('=','g')//g代表全部
let newMsg=JSON.stringify(msg).replace(reg,'&&&');
console.log(newMsg)
const reg = new RegExp('",', 'g');// g代表全部
const xxlJobParams = JSON.stringify(this.childModuleObj).replace(reg, '",
');
改造前：
{"accperiod":"","dayPayCodeEnd":"","dayPayCodeStart":"","magic":"","treatyIds":""}
加上
之后：
{"accperiod":"",
"dayPayCodeEnd":"",
"dayPayCodeStart":"",
"magic":"",
"treatyIds":""}
页面提示：
{"accperiod":"abc",
"dayPayCodeEnd":"abc",
"dayPayCodeStart":"abc",
"magic":"eqwew,werwer,wer,wer,wer,wer",
"treatyIds":"abc"}
3、方式一
this.$message({
type: 'info',
message: xxlJobParams
});
效果：
4、方式二
this.$message({
type: 'info',
dangerouslyUseHTMLString: true,
message: xxlJobParams
});
效果：
方式一和方式二均不好使，加上
之后，显示不全了，最后是...
参看链接：
https://www.cnblogs.com/coderwhytop/p/14524800.html
https://www.cnblogs.com/wangxiaoer5200/p/11491816.html
let arr = ['测试一', '测试二', '测试三'];
let str = arr.join('
');
this.$message({
dangerouslyUseHTMLString: true,
message: str,
type: 'warning'
});
使用上面简单的属性 dangerouslyUseHTMLString: true,就可以实现换行；
5、方式三
this.$msgbox({
title: '参数列表',
message: xxlJobParams,
dangerouslyUseHTMLString: true,
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消'
}).then(action => {
this.$message({
type: 'info',
message: 'action: ' + action
});
}).catch((e) => {
console.log('生成参数列表失败', e);
});
效果：
可以去掉.then
不加.catch报如下错误：
:9527/#/accountChecking/xxlJobInfo:1 Uncaught (in promise) cancel Promise.then (async) confirm @ index.vue?95f2:92 invokeWithErrorHandling @ vue.runtime.esm.js:1854 invoker @ vue.runtime.esm.js:2179 original._wrapper @ vue.runtime.esm.js:6917
京公网安备 11010802041100号