<template>
<view>
<input v-modal="num" type="number" placeholder="请输入" :maxlength="3" @input="onInputOne" />
<input v-modal="discount" type="number" placeholder="请输入" :maxlength="3" @input="onInputTwo" />
</view>
</template>
<script>
export default {
data() {
return {
num: '',
discount: ''
}
},
methods: {
// 这里举例折扣大于0,但是小于10,默认最小值为0,最大值为9.9
// 第一种方法使用延时,H5端有效,但App端不是很完美,其他端未测
onInputOne() {
if (Number(this.num) < 0) {
this.num = '0'
} else if (Number(this.num) >= 10) {
setTimeout(() => { // 设置延迟10ms有效,App端设置0实测无效
this.num = '9.9'
}, 10)
}
},
// 第二种方法使用异步修改,利用this.$nextTick实现
onInputTwo() {
if (Number(this.num) < 0) {
this.num = '0'
} else if (Number(this.num) >= 10) { // APP,H5端实测有用
this.$nextTick(() => {
this.num = '9.9'
})
}
}
}
}
</script>
<style>
</style>