界面代码:
<input @input="inputArea" :data-max="cropProduct.maxArea" name="area" type="number" :value="cropProduct.area" placeholder="请输入定植面积"></input>
@input事件代码：
inputArea(e){
var area = Number.parseFloat(e.target.value);
var maxArea = Number.parseFloat(this.cropProduct.maxArea);
console.log(area,maxArea)
console.log(area>maxArea)
this.cropProduct.area='';
if(area>maxArea){
this.cropProduct.area=maxArea;
}else{
this.cropProduct.area = e.target.value
}
console.log(this.cropProduct.area)
}
5***@qq.com
- 发布：2021-09-25 09:34
- 更新：2021-10-14 22:39
- 阅读：474
产品分类： uniapp/小程序/微信
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win7
第三方开发者工具版本号： 1.05.2109101
基础库版本号： 2.19.5
项目创建方式： CLI
CLI版本号： 3.2.8.20210923-alpha
示例代码：
操作步骤：
1、输入数字超过max设定最大值，value会变更为max最大值
2、继续输入超过max数字，input执行代码正确执行，但界面中的value不刷新。
1、输入数字超过max设定最大值，value会变更为max最大值
2、继续输入超过max数字，input执行代码正确执行，但界面中的value不刷新。
预期结果：
输入的数字大于设定最大值时，value设定为max的值。
输入的数字大于设定最大值时，value设定为max的值。
实际结果：
第一次value刷新，继续录入不刷新
第一次value刷新，继续录入不刷新
bug描述：
需求是这样的：input事件监听值改变时，如果输入值大于限定最大值要更新为最大值。
问题：第一次执行是正确的，输入值超过最大设定值value会变更为最大值，但如果继续录入数字超过设定最大值时，界面上的value不再刷新，而cropProduct.area是正确变更了的。
_孙大圣_ - 只想用nvue
这个问题一直是这样- -。nvue也是这样，，不能及时更新,不过可以绕开，你可以试试下面这个代码
input(e){
if(e.detail.value > 10){
this.tiNumber = 2;
setTimeout(()=>{
this.tiNumber = 10;
},1);
}
}
5***@qq.com (作者)
谢谢，用延时的确可以变相的解决这个问题。
2022-07-03 10:41