Flutter中TextFormField模板校验器返回Null不符合String类型要求问题

问题根源 #

1. 参数类型定义错误：你定义的validationState参数类型为String Function(String)?，但TextFormField的validator要求函数类型是String? Function(String?)?——它允许接收null输入（用户未输入内容时），且返回值可以是null（校验通过）或错误提示字符串。
2. 函数内语法错误：_buildRoundedTextField里的validator部分代码存在语法问题，当前写法无法正确关联传入的校验函数。

修正后的代码 #

1. 修复模板函数

TextFormField _buildRoundedTextField(
  String label,
  TextEditingController controller, {
  TextInputType? keyboardType,
  bool isPassword = false,
  // 修正参数类型，匹配TextFormField的validator要求
  String? Function(String?)? validationState,
}) {
  return TextFormField(
    controller: controller,
    keyboardType: keyboardType,
    obscureText: isPassword,
    decoration: InputDecoration(
      labelText: label,
      filled: true,
      fillColor: Colors.grey[200],
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(10.0),
      ),
    ),
    // 修复语法：传入自定义校验函数，无则用默认空校验（返回null表示通过）
    validator: validationState ?? (value) => null,
  );
}

2. 修正调用时的校验函数

注意处理输入为空的情况，避免null传入正则匹配导致崩溃：

_buildRoundedTextField('Family Name', familyNameController,
  validationState: (value) {
    // 先处理空输入
    if (value == null || value.isEmpty) {
      return '请输入姓氏';
    }
    String pattern = r'^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$';
    RegExp regExp = RegExp(pattern);
    if (!regExp.hasMatch(value)) {
      return '请输入有效的邮箱地址';
    }
    // 校验通过时返回null，现在类型匹配不会报错
    return null;
  },
),

说明 #

• 修正参数类型后，校验函数允许返回null（代表校验通过），完全符合Flutter的TextFormField校验规则。
• 增加空输入判断，避免因value为null触发正则匹配的异常。

内容的提问来源于stack exchange，提问作者editix