CSWL官方博客
加载中...
js将数字金额用符号间隔 vu...
碎星
UID:10563
练气期
2026-04-25
155
最近用VUE开发的财务系统，牵扯了很多金额，金额几千上万，数字不好区分，需求需要实现金额三位一隔，每三位用逗号或者其他符号隔开，那么安排一下。
// 金额三位间隔
export const interval = (key) => {
key += '';
let x = key.split('.');
let x1 = x[0];
let x2 = x.length > 1 ? '.' + x[1] : '';
let reg = /(\d+)(\d{3})/;
while (reg.test(x1)) {
x1 = x1.replace(reg, '$1' + ',' + '$2');
// x2 = x2.replace(reg, '$1' + ',' + '$2');
}
return x1 + x2;
}上方代码x1是小数点之前的，x2注释的是小数点之后的间隔，因为我们保留两位数，所以x2不需要，一般也都不需要后面的吧，所以我注释了，如果你需要，取消注释即可。
上方我用的 逗号 隔开的，大家可以使用 空格 - 等来间隔。
正则中，我写的3是三位间隔，你想银行卡四位间隔那就改为4，当然，你也可以把这个参数改为动态的，通过传值来实现。
VUE使用，先引入
import { interval } from '@A/resource/Utils';使用
this.info.price = interval(this.info.price);
如果页面中是循环显示的金额数据，我们不能直接像上方那样单独来转换赋值，low方法就是for循环了或者其他遍历方法进行赋值，下面给大家在分享一个简单的方法吧（此方法也使用于上方单个赋值）！
组件中也需要引入interval
并在methods写入
methods: {
interval(val){
return interval(val)
}
}在标签中就可以直接使用，如下
<div v-for="(item, index) in list" :key="index">
<span>￥{{ interval(item.price) }}</span>
</div>
相关帖子
看过的人
(27)
-
兔耳 -
ァ伱の吢 -
乱心 -
我有孤独和酒 -
夏伤
头条热榜
滑动查看更多
抖音热榜
滑动查看更多
快手热榜
滑动查看更多
2025年乙巳年蛇年
13:36:00
公历日期
9月26日
农历日期
八月初五
星期
星期五
下午好
金秋时节，愿您收获满满