创建utils/filters.js
// 成千上万:数字每三位加个逗号 1,234,567,890
export function toThousands (number) {
// 方法一
// let result = [],
// counter = 0;
// number = (number || 0).toString().split('');
// for (let i = number.length - 1; i >= 0; i--) {
// counter++;
// result.unshift(number[i]);
// if (!(counter % 3) && i != 0) {
// result.unshift(',');
// }
// }
// return result.join('');
// 方法二
let n = number,
r = "",
mod = "",
temp = "";
do {
mod = n % 1000;
n = n / 1000;
temp = ~~mod;
r = (n >= 1 ?`${temp}`.padStart(3, "0"): temp) + (!!r ? "," + r : "")
} while (n >= 1)
let strNumber = number + "";
let index = strNumber.indexOf(".");
if (index > 0) {
r += strNumber.substring(index);
}
return r;
}
// 金额取整
export function changeIntRMB (number) {
// 方法一
// if (number === '--' || number === null || number === undefined) return number;
// return Number.isInteger(number)?`¥${number}.00`:`¥${number}`;
// 方法二
//1. 可能是字符串,转换为浮点数
//2. 乘以100 小数点向右移动两位
//3. Math.round 进行四舍五入
//4. 除以100 小数点向左移动两位 实现保留小数点后两位
let value = Math.round(parseFloat(number) * 100) / 100;
// 去掉小数点 存为数组
let arrayNum = value.toString().split(".");
//只有一位(整数)
if (arrayNum.length == 1) {
return "¥" + value.toString() + ".00";
}
if (arrayNum.length > 1) {
//小数点右侧 如果小于两位 则补一个0
if (arrayNum[1].length < 2) {
return "¥" + value.toString() + "0";
}
return "¥" + value;
}
}
// 数字格式化
export function tranNumber (number, point = 2) {
// point是保留几位小数
if (number === null || number === undefined || number === '' || number === '--') return '--'
if (!(number >= 0)) {
if (!number) {
return '-'
}
return number
}
number = number + ''
const numStr = number.toString()
const numStrNoPoint = numStr.split('.')[0]
const len = numStrNoPoint.length
let decimal
// 十万以内直接返回
if (len < 6) {
return numStr
} else if (len > 8) {
// 大于8位数是亿
decimal = numStrNoPoint.substring(
numStrNoPoint.length - 8,
numStrNoPoint.length - 8 + point
)
if (decimal.length < 2) {
decimal = decimal.padEnd(2 - decimal.length, '0')
}
return (
Math.floor(numStrNoPoint / 100000000) + '.' + decimal + '亿'
)
} else if (len > 5) {
// 大于6位数是十万 (以10W分割 10W以下全部显示)
decimal = numStrNoPoint.substring(
numStrNoPoint.length - 4,
numStrNoPoint.length - 4 + point
)
if (decimal.length < 2) {
decimal = decimal.padEnd(2 - decimal.length, '0')
}
return Math.floor(numStrNoPoint / 10000) + '.' + decimal + 'w'
}
}
// 文字判空处理
export function tranNull (value) {
if (value === null || value === undefined || value === '') return '--'
return value
}
// 将秒转化成 (时:分:秒)
export function secTotime(value) {
let secondTime = parseInt(value); // 秒
let minuteTime = 0; // 分
let hourTime = 0; // 小时
if(secondTime > 60) { //如果秒数大于60,将秒数转换成整数
//获取分钟,除以60取整数,得到整数分钟
minuteTime = parseInt(secondTime / 60);
//获取秒数,秒数取佘,得到整数秒数
secondTime = parseInt(secondTime % 60);
//如果分钟大于60,将分钟转换成小时
if(minuteTime > 60) {
//获取小时,获取分钟除以60,得到整数小时
hourTime = parseInt(minuteTime / 60);
//获取小时后取佘的分,获取分钟除以60取佘的分
minuteTime = parseInt(minuteTime % 60);
}
}
let HH = parseInt(hourTime)<10?'0'+parseInt(hourTime):parseInt(hourTime); //时
let mm = parseInt(minuteTime)<10?'0'+parseInt(minuteTime):parseInt(minuteTime); //分
let ss = parseInt(secondTime)<10?'0'+parseInt(secondTime):parseInt(secondTime); //秒
return `${HH}:${mm}:${ss}`;
}
全局注册
// 在main.js引入
import * as filters from '@/utils/filters'
Object.keys(filters).forEach(key => {
Vue.filter(key, filters[key])
})
使用方式
<p>{{quantity | toThousands}}</p>
<p>{{price | changeIntRMB}}</p>