Flutter表单验证插件flutter_field_validator的使用

在Flutter中，处理表单验证是一个常见的需求。flutter_field_validator 是一个简单的字段验证插件，可以帮助开发者轻松实现表单验证功能。通过继承 FieldValidatorCore，可以轻松扩展自定义验证器。

如何使用

使用 flutter_field_validator 非常简单。只需实例化一个 FieldValidator，传入所需的验证规则并调用 validate() 方法即可。

以下是一个完整的示例，展示了如何在 TextFormField 中使用 flutter_field_validator 插件进行表单验证。

完整示例代码

import 'package:flutter/material.dart';
import 'package:flutter_field_validator/flutter_field_validator.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("Flutter 表单验证示例"),
        ),
        body: Padding(
          padding: const EdgeInsets.all(16.0),
          child: MyForm(),
        ),
      ),
    );
  }
}

class MyForm extends StatefulWidget {
  @override
  _MyFormState createState() => _MyFormState();
}

class _MyFormState extends State<MyForm> {
  final _formKey = GlobalKey<FormState>();

  String _password = "";

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          TextFormField(
            decoration: InputDecoration(labelText: "用户名"),
            validator: (value) => FieldValidator([
              RequiredFieldValidator(errorMessage: "用户名不能为空"),
            ]).validate(),
          ),
          SizedBox(height: 20),
          TextFormField(
            decoration: InputDecoration(labelText: "密码"),
            obscureText: true,
            validator: (value) => FieldValidator([
              RequiredFieldValidator(errorMessage: "密码不能为空"),
              LengthFieldValidator(
                minLength: 6,
                errorMessage: "密码长度不能少于6个字符",
              ),
              PatternFieldValidator(
                r"^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,}$",
                errorMessage: "密码必须包含字母和数字",
              ),
            ]).validate(),
          ),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text("表单验证成功！")),
                );
              } else {
                ScaffoldMessenger.of(context).showSnackBar(
                  SnackBar(content: Text("表单验证失败，请检查输入！")),
                );
              }
            },
            child: Text("提交"),
          ),
        ],
      ),
    );
  }
}

代码说明

1. 导入依赖：

   import 'package:flutter_field_validator/flutter_field_validator.dart';