uniapp type="digit"在iOS上显示为逗号的问题如何解决？

在uniapp中使用input组件的type="digit"时，iOS设备上输入的数字会显示为逗号分隔格式（例如1,000），而Android设备正常显示纯数字（1000）。如何统一让iOS也显示为不带逗号的纯数字格式？已尝试设置locale属性为"zh-CN"无效，请问有什么解决方案？

zlyuanteng 1楼

在uni-app中，iOS上type="digit"输入框显示逗号的问题，可通过设置input事件处理，用正则替换逗号为小数点解决。示例代码：

<input type="digit" @input="handleInput" />

handleInput(e) {
  e.detail.value = e.detail.value.replace(/,/g, '.');
}

yibo5220 2楼

在uni-app中，当使用<input type="digit">时，iOS设备可能会将小数点显示为逗号（取决于系统区域设置）。以下是解决方案：

方法1：强制使用数字键盘（推荐）

<input 
  type="text" 
  pattern="[0-9]*" 
  inputmode="decimal"
  @input="handleInput"
/>

方法2：通过CSS隐藏默认样式并自定义

input[type="digit"] {
  -webkit-appearance: none;
  appearance: none;
}

方法3：使用正则表达式过滤输入

methods: {
  handleInput(e) {
    let value = e.detail.value;
    // 替换逗号为点
    value = value.replace(/,/g, '.');
    // 只保留数字和小数点
    value = value.replace(/[^\d.]/g, '');
    this.value = value;
  }
}

方法4：使用uni-app的number类型

<input type="number" @input="handleNumberInput"/>

推荐组合方案：

<input 
  type="text"
  inputmode="decimal"
  pattern="[0-9]*"
  placeholder="请输入数字"
  @input="filterInput"
/>

filterInput(e) {
  let value = e.detail.value;
  value = value.replace(/,/g, '.').replace(/[^\d.]/g, '');
  // 防止多个小数点
  const parts = value.split('.');
  if (parts.length > 2) {
    value = parts[0] + '.' + parts.slice(1).join('');
  }
  this.value = value;
}