先看下过程
<InputNumber v-model="num" @on-change="numChange"></InputNumber>
data () {
return {
num: 0,
num1: 100
}
}
错误的写法
此时你会发现输入框内的值在大于100时并没有变成100
methods: {
numChange () {
if (this.num > 100) {
this.num = this.num1 // this.num 结果应该是100,但输入框内却不是100,而是当前输入的数
}
}
}
正确的写法
用一个延时器延迟赋值,因为change事件中做判断后才能赋值,尽管时间短的可以忽略不计,但我们依然要在输入后对它进行延迟赋值,这样就不会在检测中产生事件冲突
methods: {
numChange () {
if (this.num > 100) {
setTimeout( () => { // 此时多了一个延时器
this.num = this.num1
})
}
}
}