效果展示:
整数情况: 小数情况:
小编这里是以微信小程序举例,代码通用可兼容vue等。
1.在utils文件下创建工具util.js文本
util.js页面:
// 格式化数字 val-要格式的数字 Num-要补几位
function FormateNum(val,Num) {
let num = val;
if(num) {
if(num.indexOf(".")>-1) { //本来就是小数的情况
let arr = num.split('.')
num = arr[0] +'.' + arr[1].padEnd(Num, '0')
}else { //整数的情况
let addzero = "";
num +="."+addzero.padEnd(Num,'0')
}
}
return num;
}
module.exports ={
FormateNum //必须写这个,导出模块,不然没法运用
}
2.运用工具类(即要处理数据的页面)
demo.js页面:
//require('../../utils/util.js') :util.js的路径
//FormateNum :util.js导出的模块FormateNum
const {FormateNum} = require('../../utils/util.js')
Page({
data: {
sum:""
},
setValue(e) {
let value = e.detail.value;
this.setData({
'sum': FormateNum(value,3)
})
},
})
demo.wxml页面:
<input class="inputText" type="digit" placeholder="请输入" value="{{sum}}" bindblur="setValue"/>