vue金额格式化的方法

  • 封装全局js文件,并在main.js中引用
//global.js
export default {install(Vue) {Vue.prototype.$moneyFormat = (money) => {if ((/^(([1-9][0-9]*)|(([1-9]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/.test(money))) {const moneyArr = Number(money).toFixed(2).split('.');return `${Number(moneyArr[0]).toLocaleString()}.${moneyArr[1]}`;}if (money === undefined || money === '') {return '--';}return money;};};};//main.js
import global from './utils/global';
Vue.use(global);
  • 在页面中直接使用
<div>{{ $moneyFormat( form.fee )}}</div>

html中使用

  • 金额格式化 (千位符区分)
function numFormat(num) {var money = (num.toString().indexOf('.') !== -1) ? num.toLocaleString() : num.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');return money ;
}

-金额千位分隔并补充小数点后两位

// 第一种
function fmoney(s, n) { n = n > 0 && n <= 20 ? n : 2; s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + ""; var l = s.split(".")[0].split("").reverse(), r = s.split(".")[1]; t = ""; for (i = 0; i < l.length; i++) { t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : ""); } return t.split("").reverse().join("") + "." + r;
}
console.log(fmoney('需要格式化的值'));
  • 金额只保留小数点后两位,如果是整数补充小数点后两位
//第二种
function fmoney2(x) {let f = parseFloat(x);if (isNaN(f)) {return false;}let f = Math.round(x * 100) / 100;let s = f.toString();let rs = s.indexOf('.');if (rs < 0) {rs = s.length;s += '.';}while (s.length <= rs + 2) {s += '0';}return s;
}
fmoney2('需要转换的值', 2)//2是保留后两位或补充小数点后两位

input

  • input事件,只允许输入数字及小数点后两位。
// 退款金额
theSortNum() {this.theNum =this.theNum.replace(/[^\d.]/g, '') // 清除“数字”和“.”以外的字符.replace(/\.{2,}/g, '.') // 只保留第一个. 清除多余的.replace(/^\./g, '') // 保证第一个为数字而不是..match(/^\d*(\.?\d{0,2})/g)[0] || ''; // 保留小数点后两位if (判断) {// ....执行}
},
// input行内只允许输入数字
<el-input v-model="" placeholder="请输入" onkeyup="value=value.replace(/[^\d]/g,'')"></el-input>
// input校验是否输入为数字并只允许小数点后两位
<el-form-itemlabel="金额(万元)"prop="value"placeholder="请输入金额":rules="rules.value"
><el-input v-model="value"></el-input>
</el-form-item><script>
const PATTERN_NUM = /^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/
const VALID1 = {pattern: PATTERN_NUM,message: '格式不正确',}
export default {data() {return {rules: {value: [VALID1]}}}
}
</script>

金额保留小数点后两位方法相关推荐

  1. java 常用四舍五入保留小数点后两位方法

    java 常用四舍五入保留小数点后两位方法 1 . Math.round double num = Math.round(5.2544555 * 100) * 0.01; System.out.pri ...

  2. excel2019如何保留小数点后两位方法

    描述:excel2019如何保留小数点后两位方法 步骤: 使用=round(单元格,2)函数

  3. Java保留小数点后两位方法(推荐使用NumberFormat)

    就是 DecimalFormat返回的是String类型,考虑到使用场景一般使用NumberFormat 废话不多说,直接上代码. /*** 两数相除保留小数点后两位*/public static S ...

  4. VUE 框架添加全局公共方法 , 保留小数点后两位

    在main.js 里面给Vue对象添加方法. 来一个示例代码: import Vue from 'vue' import App from './App'Vue.prototype.num_to_st ...

  5. java小数点后两位 四舍五入_Java中double函数,四舍五入并保留小数点后两位的4种方法,BMI案例...

    今天写了一个小程序,Java 语言的测试BMI[谁不知道"BMI"的自行百度不解释],涉及到了四舍五入并保留小数点后两位,就总结了一下.先给大家看看程序 就是说给大家提供4种方法来 ...

  6. 请编写一个个人所税计算器,用户输入应发工资薪金所得、五险一金金额和个税免征额,输出应缴税款和实发工资,结果保留小数点后两位。当输入数字小于0或等于0时,输出“error”。‪

    题目 假设个人所得税税率表如下:‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬‬ ...

  7. java除法保留两位小数_JAVA除法保留小数点后两位的两种方法

    1.利用Math.round()的方法: 两个int型的数相除,结果保留小数点后两位: int a=1188; int b=93; double c; c=(double)(Math.round(a* ...

  8. java保留小数点后两位(小数点保留两位方法)

    java.怎样简便的保留小数点后两位. 有两种情况: 1.只要输出结果的时候可以用以下方法: double x1 = 0.026; System.out.println(String.format(& ...

  9. double类型保留小数点后两位的几种方法

    double类型保留小数点后两位的几种方法 返回double类型 返回double类型需要注意的是:如果结果为2020.10时,输出的值为2020.1,只保留了一位小数. //四舍五入double o ...

最新文章

  1. OpenCV图像处理使用笔记(六)——图像滤波
  2. 基于Vmware player的Windows 10 IoT core + RaspberryPi2安装部署
  3. 列表逆向排列的几种实现形式
  4. hdu 1358 Period
  5. python第一个公开发行版_python之基础篇(一)
  6. 思维导图MindManager:大脑思维发散和归纳的工具
  7. Hadoop基础【HDFS的shell,客户端操作、上传下载流程】
  8. 【物联网方案】智慧鸡舍功能及特点
  9. 一起来扒一扒B站董事长陈睿的那些传奇经历
  10. 广告行业计费模式专业术语
  11. <马哲>价值规律的内容、表现形式及其作用
  12. Windows10专业版系统镜镜像
  13. python更新的命令_python升级命令
  14. 关于联合体及联合体嵌套结构体
  15. Vue实现拖拽穿梭框功能四种方式
  16. 抽象类 [Java]
  17. (原創) M型化的NB使用族群:談ASUS Eee PC的爆紅對應用程式開發的影響 (OS) (Linux)...
  18. JAVA PrinterJob 指定打印机
  19. Pspice——RC时间常数
  20. 滑动平均滤波器与CIC滤波器

热门文章

  1. 从零学前端第一讲:前端开发是什么?给初学者有什么建议?
  2. C语言的一些基础语法
  3. 字节跳动-后端开发岗最新春招面经分享,四面拿下,有惊无险
  4. 图片如何进行格式转换?图片格式怎么改成jpg?
  5. 祝大家2022幸福安康
  6. 代码跳转路由报错_vue路由报错Navigating to current location (/login) is not allowed踩坑总结...
  7. “酸甜苦辣”说华育(我一个学员的学习心得)
  8. java接口自动化测试-导入xslx模板进行批量检索
  9. Contabs日志中报错:No MTA installed, discarding output
  10. 【调剂】2020年西安建筑科技大学考研调剂信息(含接收专业)