- 小程序input组件本身没有自带这个校验属性,但有一个maxlength属性,可以通过是否输入了小数点来动态计算设置maxlength的方法达到限制输入的目的
index.wxml
<view>
<input bindinput="inputPrice" maxlength='{{maxlength}}' placeholder="请输入您要充值的金额" type="digit"/>
</view>
index.js
page({
data: {
maxlength:50,//通过maxlength属性限制输入两位小数
price:0
},
inputPrice:function(e) {
let price = e.detail.value;
let maxlength = price.indexOf('.') + 3;
//为什么是2呢?没有小数点的时候indexOf('.')返回-1,-1+3=2,
//所以没有小数点的时候限制长度为50位,
//有小数点的话直接设置maxlength为 整数部分+小数点一位+两位小数,indexOf返回的是从0开始计算的索引,所以加3就是保留两位小数
if(maxlength == 2){
maxlength = 50;
}
this.setData({
maxlength,
price
})
}
})
网友评论