flutter - 如何在 listviewbuilder 的 textformfield 中添加验证？

Question

我正在使用 Listviewbuilder 创建一个动态文本表单字段：-

(1)。我想在移动字段 (2) 中添加验证。我想在名称字段中添加验证

但在动态条件下，我的验证无法正常工作。

标签： flutterdart

Answer 1

首先将您的字段验证存储在如下地图中。

Map 包含“key”作为字段名称和“values”作为验证器函数。

Map<String, String? Function(String?)?> formFields = {
      'username': (String? value) {
        return (value!.isEmpty) ? 'Can not be Empty' : null;
      },
      'password': (String? value) {
        return (value == null || value!.length < 8)
            ? 'Must be 8 Char Long'
            : null;
      },
    };

使用 Map 键访问验证器功能。

formFields[formFields.keys.elementAt(index)]

然后使用 ListView.builder 生成多个 TextFormFields，如下所示。

ListView.builder(
                  itemCount: formFields.length,
                  itemBuilder: (context, index) {
                    return TextFormField(
                      decoration: InputDecoration(
                        labelText: formFields.keys.elementAt(
                            index), // this gives key String ('username', 'password')
                      ),
                      onSaved: (String? value) {},
                      validator: formFields[formFields.keys.elementAt(index)],
                    );
                  },
                ),

对于不同类型的表单元素，比如说 TextFormField、DropdownButtonFormField，您可以直接在 MAP 上添加这些小部件，而不仅仅是 Validator。

 Map<String, String? Function(String?)?> formFields = {
      'username': TextFormField(
                      decoration: InputDecoration(
                        labelText: formFields.keys.elementAt(
                            index), // this gives key String ('username', 'password')
                      ),
                      onSaved: (String? value) {},
                      validator: TextFormField(
                      decoration: InputDecoration(
                        labelText: formFields.keys.elementAt(
                            index), // this gives key String ('username', 'password')
                      ),
                      onSaved: (String? value) {},
                      validator: (String? value) {
    return (value!.isEmpty) ? 'Can not be Empty' : null;
  },
                    );,
                    );,
   );