金额保留小数点后两位方法

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-item
 label="金额(万元)"
 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>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值