el-input标签即使使用type=number或者v-model.number属性,可能也没有完全符合我们想要的结果,所以下面手动写正则表达式
el-input 只能输入整数(包括正数、负数、0),没有长度限制
<el-input type="text" v-model="height" @input="handleEdit" /></div>
handleEdit(e) {
let value = e.replace(/[^(\-\d)]/g,"")
value = value.replace(/\-{2,}/g, '-')
value = value.replace(/(?<=\d)-/g, '')
value = value.replace(/-(?=0)/g, '0')
value = value.replace(/^0+(\d)/, '$1')
this.height = value
}
el-input 输入整数(包括正数、负数、0)和小数,保留15位整数和2位小数
<el-input type="text" v-model="height" @input="handleInput" @blur="handleBlur" /></div>
handleInput(e) {
let value = e.replace(/[^(\-\d.)]/g, '')
value = value.replace(/^\./g, '')
value = value.replace(/\.{2,}/g, '.')
value = value.replace(/(?<=-|\.\d+)\./g, '')
value = value.replace(/\-{2,}/g, '-')
value = value.replace(/(?<=\d|\.)-/g, '')
value = value.replace(/-(?=0{2})/g, '0')
value = value.replace(/(?<=-)0+(?=\d)/g, '')
value = value.replace(/^0+(\d)/, '$1')
value = value.replace(/(\d{15})\d*/, '$1')
value = value.replace(/(\.[0-9]{2})\d*/, '$1')
this.height= value
}
handleBlur(e) {
const value = e.target.value
if (value) {
const value = e.target.value == '-' ? '0': e.target.value
height.value = parseFloat(value).toFixed(2)
}
}
写得有点复杂,没办法,刚上手的正则表达式。如果配合el-input标签的type=number或者v-model.number属性,正则表达式部分也许不用写这么多而且复杂。有更简洁的方法请评论区留言 附上: 正则表达式 学习网址 正则表达式在线测试网址
|