由于近期负责支付系统方面，所以涉及的数值金额方面的会很多，需要格式化的也就多了，找了一大圈，效果不佳，功夫不负有心人还是解决了，下面记录一下实现方法和代码，希望对你有帮助。
需求：把涉及数值金额用逗号分隔三位，且需要保留两位小数
处理方法：
1，在vue项目utils目录中，新建一个defined.js文件作为模块导出，
2，在vue引入，使用过滤器
// 引入格式化函数
import {
cutMoneyFiter } from '@/utils/defined';
// 使用过滤器方法，
filters: {
cutMoneyFiter
},
// 模板使用：格式化方法处理
<span class="amount">{
{
forn.accout | cutMoneyFiter }}</span>
3，实现defined.js代码如下：
export const cutMoneyFiter = (amount) => {
if(!amount) {
return "-"
}
//强制保留两位小数
let f = parseFloat(amount);
if (isNaN(f)) return false;
f = Math.round(amount * 100) / 100;
let s = f.toString();
let rs = s.indexOf('.');
if (rs < 0) {
rs = s.length;
s += '.';
}
while (s.length < (rs + 1) + 2) {
s += '0';
}
//每三位用一个逗号隔开
let leftNum=s.split(".")[0];
let rightNum="."+s.split(".")[1];
let result;
//定义数组记录截取后的价格
let resultArray=new Array();
if(leftNum.length>3){
let i=true;
while (i){
resultArray.push(leftNum.slice(-3));
leftNum=leftNum.slice(0,leftNum.length-3);
if(leftNum.length<4){
i=false;
}
}
//由于从后向前截取，所以从最后一个开始遍历并存到一个新的数组，顺序调换
let sortArray=new Array();
for(let i=resultArray.length-1;i>=0;i--){
sortArray.push(resultArray[i]);
}
result=leftNum+","+sortArray.join(",")+rightNum;
}else {
result=s;
}
return result;
}
记录：格式化功能类似（与上文无关）
作用：格式化之截取指定位数处理方法
代码如下：
/**
* 对源数据截取decimals位小数，不进行四舍五入
* @param {*} num 源数据
* @param {*} decimals 保留的小数位数
*/
export const cutOutNum = (num, decimals = 2) => {
if (isNaN(num) || (!num && num !== 0)) {
return '-'
}
function toNonExponential (_num) {
var m = Number(_num).toExponential().match(/\d(?:\.(\d*))?e([+-]\d+)/)
return Number(_num).toFixed(Math.max(0, (m[1] || '').length - m[2]))
}
// 为了兼容科学计数法的数字
num = toNonExponential(num)
// 获取小数点的位置 + 1（不存在小数点的indexOf值为-1）
const pointIndex = String(num).indexOf('.') + 1
// 获取小数点后的个数(需要保证有小数位)
const pointCount = pointIndex ? String(num).length - pointIndex : 0
// 补零函数
function zeroFill (zeroNum, num) {
for (let index = 0; index < zeroNum; index++) {
num = `${
num}0`
}
return num
}
// 源数据为"整数"或者小数点后面小于decimals位的作补零处理
if (pointIndex === 0 || pointCount <= decimals) {
let tempNumA = num
// 区分"整数"和"小数"的补零
if (pointIndex === 0) {
tempNumA = `${
tempNumA}.`
tempNumA = zeroFill(decimals - pointCount, tempNumA)
} else {
tempNumA = zeroFill(decimals - pointCount, tempNumA)
}
return String(tempNumA)
}
// 截取当前数据到小数点后decimals位
const Int = String(num).split('.')[0]
const Decimal = String(num).split('.')[1].substring(0, decimals)
const tempNumB = `${
Int}.${
Decimal}`
// 需求：数据为0时，需要显示为0，而不是0.00...
return Number(tempNumB) === 0 ? 0 : tempNumB
}
更多内容待续，，