第一种方法
1.filters.index
/**
* 超过1万时使用保留两位小数
* @param value
* @param unit
* @returns {string}
*/
export function handleCount(value = '',unit = ''){
value = value || '-'
if(value >= 10000){
value = (value - value%100)/10000+unit
}
return value
}
2.在main.js中引入
// 全局filter
import * as filters from './filters'
// 注册全局filter
Object.keys(filters).forEach(key => {
Vue.filter(key, filters[key])
})
3.在页面中直接使用
![](https://i-blog.csdnimg.cn/blog_migrate/e81c49f37e86eb7d5e517641c423e6ef.png)
第二种方法
utils.index
/**
* 值比较大的数字格式化显示并改变单位
* @param value 需要格式化的值
* @param unit 原始单位
* @returns {*}
*/
export const bigNumFormatter = (value, unit) => {
let finalVal = value
let finalUnit = unit
const formatter = [
{ limit: 10000, prefixUnit: '万' },
{ limit: 10000000, prefixUnit: '千万' },
]
formatter.forEach(e => {
if ((+value >= e.limit)) {
finalVal =`${(+value / e.limit).toFixed(2)}`
finalUnit = `${e.prefixUnit}` + unit
}
})
return `${finalVal} ${finalUnit}`
}
页面中
import { bigNumFormatter } from "@/utils";
![](https://i-blog.csdnimg.cn/blog_migrate/110d24e273edc69d381e091d9261523e.png)