vue实现数字千分位格式化 如6,383,993,037,937.463

1.封装文件:numberToCurrency.js

复制代码
/**实现数字千分位格式化 如6,383,993,037,937.463 */
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.slice(0,2)
  }
  return intPartFormat + floatPart
}

2.在index.vue引用

复制代码
<template>
  <div>
      <--页面引用-->
    {{ numberToCurrencyNo(6383993037937.463) }}
  </div>
</template>


import { numberToCurrencyNo } from "@/numberToCurrency.js"; //千分位格式化

//js中使用
mounted(){
let dataNew = '6383993037937.463'
  dataNew=numberToCurrencyNo(data);
},
相关推荐
SwJieJie10 分钟前
Webpack vs Vite 构建工程化实战(Vue 项目深度解析)
前端·vue.js·webpack·node.js
alexander06822 分钟前
JavaScript 中,对象内部函数的几种等价写法,对象外部的 几种等价写法
javascript
云水一下23 分钟前
Vue.js从零到精通系列(八):项目实战——构建一个完整的电商后台管理系统
前端·javascript·vue.js
Csvn24 分钟前
Vue3 响应式陷阱:解构赋值后页面不动了?Proxy 的"隐形成员"在搞鬼
前端·vue.js
LAM LAB30 分钟前
【Web】网页如何模拟移动端获取定位\定位模拟测试
开发语言·前端·javascript
小森林之主33 分钟前
JavaScript 正则表达式:从零开始的实战对比
javascript·正则表达式·前端开发·性能对比·文本处理
weixin_4713830335 分钟前
Taro-04-网络请求
前端·javascript·taro
快乐的哈士奇38 分钟前
【Next.js实战②】Excel 派送表动态解析:表头识别与 FIELD_ALIASES 映射
前端·javascript·excel
i220818 Faiz Ul1 小时前
药店管理|基于springboot + vue药店管理系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·美食分享系统
研☆香1 小时前
jQuery特殊属性操作方法
前端·javascript·jquery