针对于复杂数字需要进行数据格式化,千分位加逗号进行区分,保留小数位等,进行封装的一个方法
<div id="app">
<div class="validate">
<input type="text" v-model="value" />
数据格式化:<span>{{result}}</span><br />
<br />
</div>
</div>
<script src="vue.js"></script>
<script>
const vm = new Vue({
el: '#app',
data: {
value: '',
value1: ''
},
computed: {
result: function() {
return this.numberFormat(this.value, 3, '.', ',');
}
},
methods: {
/**
numberFormat(123456.0789, 3, '.', ',')
非固定小数位,浮点数转成对于百分比
@param number 格式化的数字
@param decimals 保留几位小数
@param dec 小数点符号
@param sep 千分位符号
@return 输入结果
**/
numberFormat(number, decimals, dec, sep) {
number = (number + '').replace(/[^0-9+ -Ee.]/g, '');
const n = !isFinite(+number) ? 0 : +number;
const prec = !isFinite(+decimals) ? 0 : Math.abs(decimals);
const toFixedFix = (fixN, fixPrec) => {
const k = Math.pow(10, fixPrec);
return '' + Math.round(fixN * k) / k;
};
const s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split(
dec
);
const re = /(-?\d+)(\d{3})/;
while (re.test(s[0])) {
s[0] = s[0].replace(re, '$1' + sep + '$2');
}
if ((s[1] || '').length < prec) {
s[1] = s[1] || '';
s[1] += new Array(prec - s[1].length + 1).join('0');
}
return s.join(dec);
}
}
});
</script>
效果图: