HarmonyOS鸿蒙Next中TextInput输入框正则匹配问题

HarmonyOS鸿蒙Next中TextInput输入框正则匹配问题

TextInput的正则匹配输入金额，最多保留两位小数点。通过

```javascript
const moneyRegString = '^\\d+((.)|(.\\d{0,2}))?$'
const moneyReg = new RegExp(moneyRegString);
console.info('result-->',
  '<' + moneyReg.test('0.1') + '>' //true
  + '<' + moneyReg.test('0.10') + '>' //true
  + '<' + moneyReg.test('0..10') + '>' //false
  + '<' + moneyReg.test('0.101') + '>' //false
  + '<' + moneyReg.test('2..10') + '>' //false
  + '<' + moneyReg.test('8') + '>' //true
  + '<' + moneyReg.test('2.10') + '>' //true
  + '<' + moneyReg.test('2.') + '>' //true
);

打印出来的结果是正确的，但是

TextInput({ placeholder: '请输入金额', text: this.input })
  .inputFilter(moneyRegString, (e) => {
    console.log('result--->e--------------:' + JSON.stringify(e))
  })

通过设置正则就无法输入小数点符号 . 使用TextInput的inputFilter校验输入内容，但是正则仅支持单个字符匹配，不支持字符串匹配。如何实现字符串的匹配, 如何实现输入呢


更多关于HarmonyOS鸿蒙Next中TextInput输入框正则匹配问题的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

目前正则无法匹配字符串，可以考虑使用截取方法，参考：

.type(InputType.NUMBER_DECIMAL)
.enableKeyboardOnFocus(false)
.onChange((value: string) => {
  console.log('message----',value)
  if (value.indexOf('.') != -1) {
    if (value.split('.')[1].length>2) {
      this.message = value.slice(0,-1)
    }
  }
})

更多关于HarmonyOS鸿蒙Next中TextInput输入框正则匹配问题的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，TextInput组件支持通过正则表达式对输入内容进行匹配。你可以使用onChange事件监听输入内容的变化，并通过正则表达式进行验证。例如，若需要限制输入为数字，可以使用/^\d*$/作为正则表达式。如果输入内容不符合正则表达式的要求，可以通过提示或阻止输入来反馈给用户。

具体实现时，可以在onChange回调中获取输入值，并使用RegExp对象的test方法进行匹配。若匹配失败，可以根据业务需求进行处理，如清空输入或显示错误信息。

示例代码如下：

import { TextInput } from 'harmonyos';

const input = new TextInput();
input.onChange((value) => {
  const regex = /^\d*$/;
  if (!regex.test(value)) {
    // 处理不符合正则表达式的情况
    input.value = ''; // 清空输入
  }
});

此方法适用于在鸿蒙Next中实现TextInput输入框的正则匹配功能。

在HarmonyOS鸿蒙Next中，TextInput组件支持通过正则表达式进行输入内容的验证。你可以在TextInput的onChange事件中使用正则表达式来匹配输入内容。例如，限制输入只能为数字：

<TextInput
  placeholder="请输入数字"
  onChange={(text) => {
    const regex = /^\d*$/;
    if (!regex.test(text)) {
      console.log("输入非法，只能输入数字");
    } else {
      console.log("输入合法");
    }
  }}
/>

通过正则表达式，可以有效控制用户输入的内容格式，确保数据的正确性。

回到顶部