Flutter实现仅接受@meb.gov.tr后缀邮箱的输入校验

你可以通过以下几种方式实现对邮箱后缀的验证，适配不同的交互需求：

一、表单提交时验证（推荐） #

利用TextFormField的validator属性，在用户提交表单时触发验证逻辑，检查邮箱是否符合后缀要求：

TextFormField(
  // 保留你原有的style、decoration等所有属性
  style: const TextStyle(
    fontFamily: "Inter Medium",
    fontSize: 20,
    decoration: TextDecoration.none,
  ),
  decoration: InputDecoration(
    hintStyle: const TextStyle(fontFamily: "Inter Medium"),
    prefixIcon: const IconTheme(
      data: IconThemeData(
        color: Color(0xFF7878D0),
      ),
      child: Icon(Icons.email),
    ),
    prefixIconColor: Colors.transparent,
    hintText: "name@meb.gov.tr",
    contentPadding: const EdgeInsets.all(18),
    filled: true,
    fillColor: const Color.fromARGB(255, 233, 233, 233),
    focusedBorder: OutlineInputBorder(
      borderSide: const BorderSide(
        color: Color(0xFF7878D0),
        width: 1.5,
      ),
      borderRadius: BorderRadius.circular(15),
    ),
    enabledBorder: const OutlineInputBorder(
      borderSide: BorderSide(
        color: Colors.transparent,
      ),
      borderRadius: BorderRadius.only(
        topLeft: Radius.circular(22),
        topRight: Radius.circular(22),
      ),
    ),
  ),
  maxLines: 1,
  inputFormatters: [
    LengthLimitingTextInputFormatter(50),
  ],
  // 添加验证逻辑
  validator: (value) {
    if (value == null || value.isEmpty) {
      return '请输入邮箱地址';
    }
    const requiredSuffix = '@meb.gov.tr';
    // 检查是否以指定后缀结尾
    if (!value.endsWith(requiredSuffix)) {
      return '请输入@meb.gov.tr后缀的邮箱';
    }
    // 可选：补充基础邮箱格式验证
    if (value.indexOf('@') <= 0) {
      return '请输入有效的邮箱地址';
    }
    return null; // 验证通过返回null
  },
),

使用时需将TextFormField包裹在Form组件中，提交时调用formKey.currentState?.validate()即可触发验证。

二、实时输入提示（可选） #

如果想在用户输入过程中实时反馈错误，可以结合onChanged和errorText实现：

String? _emailError;

// 在State类中添加上述变量，然后修改TextFormField
TextFormField(
  // 保留原有属性...
  onChanged: (value) {
    setState(() {
      const requiredSuffix = '@meb.gov.tr';
      if (value.isNotEmpty && !value.endsWith(requiredSuffix)) {
        _emailError = '请输入@meb.gov.tr后缀的邮箱';
      } else {
        _emailError = null;
      }
    });
  },
  decoration: InputDecoration(
    // 保留原有decoration属性...
    errorText: _emailError,
  ),
),

三、自定义输入格式化器（强制限制） #

这种方式可以限制用户输入的内容必须符合后缀规则，不过要注意避免影响正常输入体验：

class MebEmailFormatter extends TextInputFormatter {
  static const _requiredSuffix = '@meb.gov.tr';

  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    final inputText = newValue.text;
    
    // 如果已经输入完整后缀，允许编辑前缀部分
    if (inputText.endsWith(_requiredSuffix)) {
      return newValue;
    }
    
    // 检查输入的后缀片段是否匹配要求，不匹配则回退
    if (inputText.length >= _requiredSuffix.length) {
      final inputSuffix = inputText.substring(inputText.length - _requiredSuffix.length);
      if (!_requiredSuffix.startsWith(inputSuffix)) {
        return oldValue;
      }
    }
    
    return newValue;
  }
}

// 在TextFormField的inputFormatters中添加
inputFormatters: [
  LengthLimitingTextInputFormatter(50),
  MebEmailFormatter(),
],

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