1.前端使用elg-pro-table 数据表格:
1 |
2.其中使用是columns表格:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | // 表格列配置 columns: [ { prop: 'voucherNo' , label: '凭证号' , showOverflowTooltip: true , minWidth: 100 , className: 'textType' }, { prop: 'originalCurrencyDebit' , label: '借方金额' , showOverflowTooltip: true , minWidth: 120, className: 'moneyType' , formatter: (value) => { //使用formatter,其中value是整个columns中的一行数据 //value.originalCurrencyDebit和上面的prop的内容一致 return commonApi.changeMoney(value.originalCurrencyDebit); } }, ], |
3.其中commonApi.changeMoney()方法是引用的一个api方法:
1 2 3 4 5 6 7 8 9 10 11 | //数值转换 changeMoney(value){ if (value === "" ){ //当value为空时,前台显示- return '-' } else { //当value等于0或者是字符串0时,显示- if ( "0.00" ===value || "0" ===value || value ===0 || value ===0.00) { return '-' } else { //判断一个变量value是否小于0。如果value小于0,那么isNegative的值就是true,否则就是false。 let isNegative = value |
至此结束。
style小贴士:
1 2 3 4 5 6 7 8 9 10 11 12 | /* 默认居中 */ .custom-card .el-table__body td { text-align : center ; } /* 金额类居右 */ .custom-card .el-table__body td.moneyType { text-align : right ; } /* 文本类居左 */ .custom-card .el-table__body td.textType { text-align : left ; } |
总结
到此这篇关于Vue前端数值转换为千分位格式并保留两位小数的文章就介绍到这了,更多相关Vue数值转换千分位保留小数内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!