<input type="number" @input="input" maxlength="10"/>
input(e){
console.log(e.detail.value);
}
秋凡
- 发布：2021-03-19 21:15
- 更新：2021-04-09 10:01
- 阅读：762
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win10 版本 10.0.19041.867
HBuilderX类型： 正式
HBuilderX版本号： 3.1.4
手机系统： Android
手机系统版本号： Android 10
手机厂商： 魅族
手机机型： 17
页面类型： vue
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
输入数字 --
输入数字 --
预期结果：
无法输入 且能限制长度 @input监听正常
无法输入 且能限制长度 @input监听正常
实际结果：
能输入，长度限制失效，@input监听无内容
能输入，长度限制失效，@input监听无内容
bug描述：
<input type="number" @input="input" maxlength="10"/>
输入框能输入+-.
且在输入俩--的时候，maxlength失效，@input监听的e.detail.value为 ""
具体的可以看下图
3 个回复
秋凡 (作者) - 全职接单 高效率、高质量 uniapp项目开发 服务器部署-运维 欢迎咨询 Q：377313813 vx:ran1ever
防止图裂 备个份
秋凡 (作者) - 全职接单 高效率、高质量 uniapp项目开发 服务器部署-运维 欢迎咨询 Q：377313813 vx:ran1ever
页面改为 .nvue时不会产生此问题
查看了下 input的源码 可能是这儿导致的
DCloud_UNI_GSQ
不是这里导致的，是浏览器（webview）的 input 表现这样，这里虽然努力了但是没有纠正过来，注释部分那是一个两难全的问题：强制验证将导致用户无法输入负号，不增加强制验证将导致用户输入错误的符号后无法纠正
2021-03-22 15:13
秋凡 (作者)
回复 DCloud_UNI_GSQ: 那这个后续处理吗
2021-03-22 15:18
DCloud_UNI_GSQ
回复 秋凡: 强制不能输入符号，这种处理方式，你认为如何？
2021-03-22 15:40
秋凡 (作者)
回复 DCloud_UNI_GSQ: 我觉得可以 一般情况下 数字输入框 基本上都是正数吧 负数的情况很少遇见
2021-03-22 15:48
秋凡 (作者)
回复 DCloud_UNI_GSQ: 这个应该是你们后面新加上去的吧 为了验证这个 我把以前的项目APP安装了一下 同样的写法 那个时候就不能输入-
2021-03-22 15:49
DCloud_UNI_GSQ
回复 秋凡: 这个新去掉的，之前不能输入符号，用户要求能输入，然后去掉了这部分并注释说明这里两难全
2021-03-22 15:52
DCloud_UNI_GSQ
回复 秋凡: 之前有三种方案候选：1.仍然保留验证不满足用户输入负号的需求 2.去除强制验证导致可以胡乱输入3.增加一个属性用户手动配置，但用户难以理解
2021-03-22 15:54
秋凡 (作者)
回复 DCloud_UNI_GSQ: 或者 可以type单独加一个 手机号的 强制输入数字
2021-03-22 16:11
DCloud_UNI_GSQ
回复 秋凡: 那你是倾向于方案 3 了
2021-03-22 16:23
秋凡 (作者)
回复 DCloud_UNI_GSQ: 3的话，适用性更广一些。最简单的直接1。输入负数的需求真的很少
2021-03-22 16:34
DCloud_UNI_GSQ
回复 秋凡: 1就回去了。。。有依赖的用户完全无法输入，得蹦起来。。。
2021-03-22 19:34
DCloud_UNI_GSQ
回复 DCloud_UNI_GSQ: 2 的话，用户只是发现了漏洞能胡乱输入，输入的只有自己能看到，也传不到后台
2021-03-22 19:35
秋凡 (作者)
回复 DCloud_UNI_GSQ: 哈哈 正所谓鱼与熊掌不可兼得 那就只有3了 多加一个type 在后面备注说明：只能输入数字
2021-03-22 21:18
DCMarvel
做个正则处理不可以吗????
DCloud_UNI_GSQ
不可以，浏览器（webview）的 input 表现这样：当验证不通过时只能知道验证不通过，不能获取到 input 值，所以不能区分-和——%……&*（
2021-04-09 10:53