Flutter Form组件的基本使用

Form组件是一个可以包含一个或多个子元素的容器类组件。
TextFormField组件是Form中常用于做用户输入的组件。

GlobalKey的currentState调用validate()，会触发TextFormField组件的validator。然后再调用save(),会触发TextFormField组件的onSaved，这是用变量就会被赋值。

简单示例

class MyState extends State {final GlobalKey<FormState> _formKey = GlobalKey<FormState>();late String userName;late String psd;@overridevoid initState() {super.initState();}@overrideWidget build(BuildContext context) {Form from = Form(key: _formKey,child: Column(children: [TextFormField(decoration: InputDecoration(labelText: "用户名"),onSaved: (newValue) {userName = newValue!;},validator: (value) {return value!.trim().isNotEmpty ? null : "用户名不能为空";},),TextFormField(obscureText: true,decoration: InputDecoration(labelText: "密码"),onSaved: (newValue) {psd = newValue!;},),Row(mainAxisAlignment: MainAxisAlignment.spaceAround,children: [TextButton(onPressed: () {if (_formKey.currentState!.validate()) {_formKey.currentState?.save();print(userName);print(psd);}},child: Text("登录"),),TextButton(onPressed: () {_formKey.currentState?.reset();},child: Text("重置"),),],),],),);return Scaffold(appBar: AppBar(title: Text("登录")),body: from,);}
}