应用场景
在编写输入金额的输入组件input时，虽然能够设置type为number，但却不能够自动检验用户输入的值是否符合金额的格式。比如，用户能够同时输入两个小数点。本文章以此为大前提展开略浅的技巧。
过程解析
原始状态
说到校验，第一个想到的就是用正则表达式。以微信小程序为例。
DOM结构
...<input type='digit' value='{{value}}' bindinput='numChange' />...JavaScript逻辑
...numChange(e) { // 修改单次金额 const NEXT = e.detail.value; let currentValue = this.data.value; const NEW_VALUE = this.numCheck(currentValue, NEXT); this.setData({ value: NEW_VALUE || currentValue; })},numCheck(prev, next) { // 数据过滤 // 只保留两位小数 if (next && !/^(([1-9]\d*)|0)(\.\d{0,2}?)?$/.test(next)) { if (next === '.') return '0.'; return prev; } return next;}...获取非空数据并且转换数据类型
因为经过过滤后，返回的数据类型是字符串，在使用时，需要再转换一下数据类型。
...getPureMoney() { // 获取干净的数据（非空） const { value } = this.data; const PARSE_VALUE = parseFloat(value); return !isNaN(PARSE_VALUE) ? PARSE_VALUE : '';},...用过都说好！
最后，嘻嘻！