uni-app Number/digit 类型 input输入框在非英语以及中文语言下 输入不了小数点

uni-app Number/digit 类型 input输入框在非英语以及中文语言下 输入不了小数点

示例代码：

<input type="digit" v-model="amount" class="amountInput" maxlength="10"/>

操作步骤：

视频已附上，在法语下无法输入小数点

预期结果：

在所有语言下可以正常输入小数点

实际结果：

在其他语言下不可以正常输入小数点

bug描述：

Number/digit 类型 input输入框在手机系统语言为英文和中文语言是正常使用键盘进行输入的，但是在其它语言的下无法输入小数点

开发环境 版本号 项目创建方式
Mac MacOs 11.0.1 HBuilderX
Android Android 9.0
手机厂商
一加
手机机型 一加9

12290.mov_.zip


更多关于uni-app Number/digit 类型 input输入框在非英语以及中文语言下 输入不了小数点的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

测试未复现此问题。仅一加9这个机型有问题吗？其他机型是否正常？

更多关于uni-app Number/digit 类型 input输入框在非英语以及中文语言下 输入不了小数点的实战教程也可以访问 https://www.itying.com/category-93-b0.html


请问这问题最后怎么解决

这是一个已知的键盘兼容性问题。type="digit"在不同语言环境下，键盘布局和输入行为存在差异。

问题原因：

  • 在英文和中文系统下，数字键盘通常包含小数点按键
  • 在其他语言（如法语）系统下，数字键盘可能使用逗号作为小数分隔符，或者键盘布局不同
  • type="digit"对键盘类型的控制在不同Android版本和厂商定制系统中表现不一致

解决方案：

  1. 使用 type="number" 替代：
<input type="number" v-model="amount" class="amountInput" maxlength="10"/>

type="number"在不同语言环境下兼容性更好，能正确显示包含小数点的数字键盘。

  1. 如果必须使用 digit 类型，添加输入过滤：
<input type="digit" v-model="amount" @input="filterDecimal" class="amountInput" maxlength="10"/>

methods: {
  filterDecimal(e) {
    // 将逗号替换为小数点
    this.amount = e.detail.value.replace(',', '.');
  }
}
  1. 使用正则表达式验证输入：
// 在提交或保存时验证
const isValidNumber = /^[0-9]*\.?[0-9]*$/.test(this.amount);
回到顶部