Flutter表单验证插件body_validate的使用

Flutter表单验证插件body_validate的使用

表单验证插件body_validate

特性

  • 零依赖
  • 可扩展
  • 经过充分测试
  • 开源

入门指南

安装

在你的Flutter项目中添加body_validate作为依赖项。通过在pubspec.yaml文件中添加以下行来实现：

dependencies:
  body_validate: "0.0.1"

然后运行flutter pub get以安装所需的依赖项。

使用方法

检查字段是否为空

你需要将一个文本字段传递给ForValidate类。

ForValidate(
  operation: CheckFiled.isEmpty,
  list: [],
  filed1: "Filed 1",
  filed2: "",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

检查字段是否为电子邮件

你需要将电子邮件地址传递给ForValidate类中的filed1字段。

ForValidate(
  operation: CheckFiled.isEmail,
  list: [],
  filed1: "mistrytrushar88@gmail.com",
  filed2: "",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

检查字段是否为手机号码

你需要将手机号码传递给ForValidate类中的filed1字段。

ForValidate(
  operation: CheckFiled.isMobile,
  list: [],
  filed1: "9687388107",
  filed2: "",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

检查字段是否为密码

你需要将密码传递给ForValidate类中的filed1字段，并将确认密码传递给filed2字段。

ForValidate(
  operation: CheckFiled.isPassWord,
  list: [],
  filed1: "trush@123",
  filed2: "trush@123",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

检查字段是否为URL

你需要将URL传递给ForValidate类中的filed1字段。

ForValidate(
  operation: CheckFiled.isUrl,
  list: [],
  filed1: "https://pub.dev/packages/body_validate/versions/0.0.1",
  filed2: "",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

检查列表是否不为空

你需要将列表传递给ForValidate类中的list字段。

ForValidate(
  operation: CheckFiled.isList,
  list: ["1", "2"],
  filed1: "",
  filed2: "",
  warningTitle: "您的标题",
  warningMessage: "您的警告信息"
),

示例代码

List<ForValidate> validateBodyList = [
  ForValidate(
    operation: CheckFiled.isEmpty,
    list: [],
    filed1: "Filed 1",
    filed2: "",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),
  ForValidate(
    operation: CheckFiled.isEmail,
    list: [],
    filed1: "mistrytrushar88@gmail.com",
    filed2: "",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),
  ForValidate(
    operation: CheckFiled.isMobile,
    list: [],
    filed1: "9687388107",
    filed2: "",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),
  ForValidate(
    operation: CheckFiled.isPassWord,
    list: [],
    filed1: "trush@123",
    filed2: "trush@123",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),
  ForValidate(
    operation: CheckFiled.isUrl,
    list: [],
    filed1: "https://pub.dev/packages/body_validate/versions/0.0.1",
    filed2: "",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),         
  ForValidate(
    operation: CheckFiled.isList,
    list: ["1", "2"],
    filed1: "",
    filed2: "",
    warningTitle: "您的标题",
    warningMessage: "您的警告信息"
  ),
];

final result = await FiledValidate().validateFileds(validateBodyList);
if (result) {
  // 执行你的任务
}

更多关于Flutter表单验证插件body_validate的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter表单验证插件body_validate的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


body_validate 是一个用于 Flutter 的表单验证插件，它可以帮助你轻松地验证表单中的输入数据。使用这个插件，你可以定义验证规则，并在用户提交表单时检查输入是否符合这些规则。

以下是如何使用 body_validate 插件的基本步骤：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 body_validate 插件的依赖：

dependencies:
  flutter:
    sdk: flutter
  body_validate: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入插件

在你的 Dart 文件中导入 body_validate 插件：

import 'package:body_validate/body_validate.dart';

3. 创建表单并定义验证规则

你可以使用 BodyValidate 类来定义验证规则。以下是一个简单的例子：

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

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

  @override
  Widget build(BuildContext context) {
    return Form(
      key: _formKey,
      child: Column(
        children: [
          TextFormField(
            controller: _emailController,
            decoration: InputDecoration(labelText: 'Email'),
            validator: (value) {
              return BodyValidate.validateEmail(value);
            },
          ),
          TextFormField(
            controller: _passwordController,
            decoration: InputDecoration(labelText: 'Password'),
            obscureText: true,
            validator: (value) {
              return BodyValidate.validatePassword(value);
            },
          ),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: () {
              if (_formKey.currentState!.validate()) {
                // 表单验证通过，处理表单数据
                print('Email: ${_emailController.text}');
                print('Password: ${_passwordController.text}');
              }
            },
            child: Text('Submit'),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    _emailController.dispose();
    _passwordController.dispose();
    super.dispose();
  }
}

4. 使用内置验证方法

body_validate 提供了一些内置的验证方法，例如：

  • validateEmail: 验证电子邮件地址。
  • validatePassword: 验证密码。
  • validatePhone: 验证电话号码。
  • validateRequired: 验证字段是否为空。

你可以在 validator 回调中使用这些方法来验证用户输入。

5. 自定义验证规则

如果你需要自定义验证规则，可以直接在 validator 回调中编写自己的逻辑：

validator: (value) {
  if (value == null || value.isEmpty) {
    return 'This field is required';
  }
  if (value.length < 6) {
    return 'Password must be at least 6 characters long';
  }
  return null;  // 返回 null 表示验证通过
},
回到顶部