我们在HarmonyOS开发中，如何一个简单的表单验证？

Question

我们在HarmonyOS开发中，如何一个简单的表单验证？

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。

Answer 1

可以创建一个表单，并使用简单的逻辑来验证输入。

欢迎讨论

@Entry
@Component
struct FormAbility {
  @State private username: string = '';
  @State private password: string = '';
  @State private isFormValid: boolean = false;

  build() {
    Column() {
      TextField(this.username).placeholder('Username');
      TextField(this.password).placeholder('Password').type(TextFieldType.Password);
      Button('Submit').disabled(!this.isFormValid).onClick(this.submitForm.bind(this));
      Text('Form is ${this.isFormValid ? "valid" : "invalid"}');
    }

    onPropertyChanged(property: string) {
      if (property === 'username' || property === 'password') {
        this.isFormValid = this.username.length > 0 && this.password.length > 0;
      }
    }

    private submitForm() {
      if (this.isFormValid) {
        // Submit form logic here
      }
    }
  }
}

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。