前端js处理数据千分位并保留指定小数位，整数的自动补全.00显示数据

最新推荐文章于 2023-06-07 10:21:41 发布

柠檬加栤

最新推荐文章于 2023-06-07 10:21:41 发布

阅读量756

点赞数

分类专栏： vue js vue.js 文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/m0_57071129/article/details/127733432

版权

vue 同时被 3 个专栏收录

31 篇文章 1 订阅

订阅专栏

22 篇文章 0 订阅

订阅专栏

vue.js

3 篇文章 0 订阅

订阅专栏

案例图

封装的方法

// 数字格式化，千分位显示格式
export const formatPrice = (s, n) => {
    if (s == null) return s  //为null 返回空
    n = n > 0 && n <= 20 ? n : 2;
    s = parseFloat((s + '').replace(/[^\d\.-]/g, '')).toFixed(n) + '';
    var l = s.split('.')[0].split('').reverse();
    var r = s.split('.')[1];
    var t = '';
    for (var i = 0; i < l.length; i++) {
        t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length && l[i + 1] != '-' ? ',' : '');
    }
    return t.split('').reverse().join('') + '.' + r;
    
}

使用的方法

//     // 使用方法如下
    //     // 直接使用前提是必须在main.js中全局注册
    //     // import { formatPrice } from "@/utlis/index.js";
    //     // 全局注册金额格式化
    //     // Vue.filter('formatPrice', function(dateStr) {
    //     //         // 在过滤器的处理函数中，最后，必须 return 一个东西，这样，才是一个合法的过滤器
    //     //         return formatPrice(dateStr)
    //     //     })
    //     //    页面直接使用
    //     // {{`获取的数字` | formatPrice}}    页面显示时间的位置