#鸿蒙通关秘籍#通过@State装饰器在鸿蒙开发中如何管理用户输入的数据？

利用@State装饰器，在鸿蒙开发组件内管理用户输入，可以通过以下代码实现：

typescript @Preview @Component struct LoginBottom { @State account: string = ''; @State password: string = '';

build() { Column() { TextInput({ placeholder: $r('app.string.account') }) .onChange((value: string) => { this.account = value; })

  TextInput({ placeholder: $r('app.string.password') })
    .type(InputType.Password)
    .onChange((value: string) => {
      this.password = value;
    })

  Button($r('app.string.login'))
    .onClick(() => {
      CommonUtils.loginArkTS(this.account, this.password);
    })
}

} }

有两个文本输入框用于输入账号和密码，每次输入改变，将新值通过@State装饰器更新到对应的变量，当点击登录按钮时，会将状态变量传递到登录方法中。