HarmonyOS 鸿蒙Next ArkTS如何验证输入TextInput的是正确的手机号码格式

发布于 1周前 作者 itying888 来自 鸿蒙OS

HarmonyOS 鸿蒙Next ArkTS如何验证输入TextInput的是正确的手机号码格式

我需要在用户登录的时候验证一个输入框 TextInput 输入的内容是否是服务要求的输入, 之后再根据是否正确展示相关的信息, 包括正确或者错误的 UI 或者提示等.

但是诸如手机号码和邮箱等, 需要满足一定格式的数据, 如何验证它们的格式是否正确呢?

以及在 ArkTS 中, 这些数据如何校验呢?

Harmonyos Next教程
2 回复
正则校验呗，不会写就去百度js正则

在HarmonyOS鸿蒙系统中，使用ArkTS验证TextInput输入是否为正确的手机号码格式，可以通过正则表达式来实现。以下是一个基本示例，展示如何在ArkTS中进行这种验证：

  1. 定义正则表达式：定义一个匹配中国大陆手机号码的正则表达式，例如 ^1[3-9]\d{9}$。

  2. 监听输入变化：在TextInput的@change事件中，获取输入值并应用正则表达式进行验证。

  3. 显示验证结果：根据验证结果，显示相应的提示信息，如“格式正确”或“格式错误”。

示例代码如下：

@Entry
@Component
struct MyComponent {
  @State private phoneNumber: string = '';
  @State private isValid: boolean = true;

  @Builder private phoneInput: TextInput;

  @Change phoneInputChange(value: string) {
    const phoneRegex = /^1[3-9]\d{9}$/;
    this.isValid = phoneRegex.test(value);
    this.phoneNumber = value;
  }

  build() {
    Column() {
      TextInput({ value: this.phoneNumber, onChange: this.phoneInputChange })
      Text(this.isValid ? '格式正确' : '格式错误')
    }.padding()
  }
}

上述代码通过监听TextInput的输入变化，实时验证输入是否为正确的手机号码格式。如果问题依旧没法解决请联系官网客服,官网地址是：https://www.itying.com/category-93-b0.html

回到顶部