Before the input event gets the value entered by the user, and then assigns the value bound to the input component, it is judged that the user’s input cannot exceed the maximum value. If it exceeds, the default is 100. This judgment and assignment and then the view update can only be triggered once. After entering, it is found that the value has changed the page but not updated. I wiped, tried both v-model and :value. It's useless, the bug described on the Internet can be traced back to 19 years. It seems to be an old bug. The solution is to write the assignment code in the delayer:
$set also tried to no avail
inputfomatter(val) {//input事件函数
console.log("input事件");
this.questList[this.questIndex].options[0].value = Number(val.target.value)
if (val.detail.value.length > 0) { //清除按钮显隐
this.showClearIcon = true;
} else {
this.showClearIcon = false;
}
if (Number(val.target.value) < this.questList[this.questIndex].rulerMinValue) { //如果用户输入的值小于最小值,则赋值为最小值
setTimeout(() => { this.questList[this.questIndex].options[0].value = this.questList[this.questIndex].rulerMinValue }, 0) //不这么写，输入的超过最大值只能重置一次，之后，虽重置了值，但是页面不更新
// this.questList[this.questIndex].options[0].value = this.questList[this.questIndex].rulerMinValue
}
if (Number(val.target.value) > this.questList[this.questIndex].rulerMaxValue) { //如果用户输入的值大于最大值,则赋值为最大值
setTimeout(() => { this.questList[this.questIndex].options[0].value = this.questList[this.questIndex].rulerMaxValue }, 0)
// this.questList[this.questIndex].options[0].value = this.questList[this.questIndex].rulerMaxValue
// this.$set(this.questList[this.questIndex].options[0], 'value', this.questList[this.questIndex].rulerMaxValue)
}
setTimeout(() => { this.questList[this.questIndex].options[0].value = this.$toFixed(Number(this.questList[this.questIndex].options[0].value), 2) }, 0)
},