-
初始化有状态表单容器 创建一个 StatefulWidget 来容纳表单。在 State 类中精确地实例化一次 GlobalKey<FormState>，以防止在 build 周期中重新生成消耗资源的键值。
import 'package:flutter/material.dart';
class CustomValidatedForm extends StatefulWidget {
const CustomValidatedForm({super.key});
@override
State<CustomValidatedForm> createState() => _CustomValidatedFormState();
}
class _CustomValidatedFormState extends State<CustomValidatedForm> {
// 在 State 对象中实例化 GlobalKey 一次
final _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return Form(
key: _formKey,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
// 表单字段将在此处注入
],
),
);
}
}
-
实现带有验证逻辑的 TextFormFields 将 TextFormField 小部件注入到 Form 的小部件树中。为每个字段提供一个 validator 函数。
TextFormField(
decoration: const InputDecoration(
hintText: 'Enter your email',
labelText: 'Email',
),
validator: (String? value) {
if (value == null || value.isEmpty) {
return 'Please enter an email address';
}
if (!value.contains('@')) {
return 'Please enter a valid email address';
}
// 如果输入有效，则返回 null
return null;
},
onSaved: (String? value) {
// 在此处处理保存逻辑
},
)
-
实现提交操作和验证触发器 创建一个按钮，通过 GlobalKey 访问 FormState 以触发验证。
Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: ElevatedButton(
onPressed: () {
// 如果表单有效，validate 返回 true，否则返回 false。
if (_formKey.currentState!.validate()) {
// 如有必要，保存表单字段
_formKey.currentState!.save();
// 提供成功反馈
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Processing Data')),
);
}
},
child: const Text('Submit'),
),
)
-
暂停并询问用户： 暂停实现，并向用户询问以下上下文信息：
- "此表单需要哪些具体字段？"
- "每个字段的确切验证规则是什么（例如，正则表达式模式、最小长度）？"
- "验证成功后应执行什么操作（例如，提交 API 负载、导航）？"
-
验证与修复循环 生成表单后，验证以下内容：
- 确保使用感叹号运算符 (
!) 或安全调用对 _formKey.currentState!.validate() 进行了正确的空值检查，以防键值可能已分离。
- 验证每个
validator 函数在成功时是否显式返回 null。返回空字符串 ("") 将触发一个没有文本的错误状态。
