在实际操作中,经常会碰到将一个数字转换成千分位格式,如:123456.3 ===> 123,456.3
为了避免每次都写一遍,我们现在封装一个处理方法,以便在其他vue页面中使用。
转换代码实现
首先创建一个文件 numberToCurrency.js ,实现数字千分位转换功能。
export function numberToCurrencyNo(value) {
if (!value) return 0
// 获取整数部分
const intPart = Math.trunc(value)
// 整数部分处理,增加,
const intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')
// 预定义小数部分
let floatPart = ''
// 将数值截取为小数部分和整数部分
const valueArray = value.toString().split('.')
if (valueArray.length === 2) { // 有小数部分
floatPart = valueArray[1].toString() // 取得小数部分
return intPartFormat + '.' + floatPart
}
return intPartFormat + floatPart
}
在页面中引入
假如你把文件 numberToCurrency.js放在src下面的utils里面,
<template>
<div>
{{ numberToCurrencyNo(123456.3) }}
</div>
</template>
<script>
import { numberToCurrencyNo } from "@/utils/numberToCurrency";
export default {
data() {
return {
numberToCurrencyNo,
};
},
};
</script>
<style lang="scss" scoped>
</style>
输出结果:123,456.3
网友评论