Question

我在Flutter TextFormField中有一个奇怪的问题。我在TextFormField中实现了表单验证。但是成功验证后不会调用onSaved（）函数。

首先，我使用TextFormField创建了基本的小部件

---在AppWidgets类中---

  static Widget buildTextFormField(
    String labelText,
    String helperText,
    IconData prefixIcon, {
    Widget suffixIcon,
    bool obscureText = false,
    TextInputType keyboardType = TextInputType.text,
    TextInputAction textInputAction = TextInputAction.none,
    FocusNode focusNode,
    ValueChanged<String> onFieldSubmitted,
    TextEditingController controller,
    FormFieldValidator<String> validator,
    FormFieldSetter<String> onSaved,
    bool isLightTheme = false,
  }) {
    return Theme(
      data: isLightTheme
          ? AppThemesLight.textFormFieldThemeData
          : AppThemesDark.textFormFieldThemeData,
      child: TextFormField(
        controller: controller,
        validator: validator,
        onSaved: onSaved,
        keyboardType: keyboardType,
        textInputAction: textInputAction,
        focusNode: focusNode,
        onFieldSubmitted: onFieldSubmitted,
        obscureText: obscureText,
        decoration: InputDecoration(
          filled: true,
          fillColor: isLightTheme
              ? AppColorsLight.textFieldFillColor
              : AppColorsDark.textFieldFillColor,
          labelText: labelText,
          helperText: helperText,
          border: OutlineInputBorder(
            borderRadius: BorderRadius.all(
              Radius.circular(AppDimensions.textFieldBorderRadius),
            ),
          ),
          prefixIcon: Icon(
            prefixIcon,
            color: isLightTheme
                ? AppColorsLight.primaryTextColor
                : AppColorsDark.primaryTextColor,
          ),
          suffixIcon: suffixIcon,
        ),
      ),
    );
  }

由此，从字段创建电子邮件文本。

  static Widget buildEmailTextFormField(LoginState loginState) {
    return AppWidgets.buildTextFormField(
      'Email address',
      'Your email address',
      Icons.email,
      keyboardType: TextInputType.emailAddress,
      textInputAction: TextInputAction.next,
      focusNode: loginState.focusNodes[0],
      onFieldSubmitted: (String value) {
        print('submitted $value');
        loginState.onFocusChanged(index: 0);
      },
      validator: (String email) {
        print('validator $email');
        return InputValidators.validateEmail(email);
      },
      onSaved: (String email) {
        print('saved $email');
        loginState.email = email;
      },
    );
  }

这是我使用的电子邮件验证程序。

  static String validateEmail(String email) {
    Pattern pattern =
        r'^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$';
    RegExp regex = new RegExp(pattern);
    if (email.isEmpty)
      return 'Email can\'t be empty';
    else if (!regex.hasMatch(email))
      return 'Enter valid email address';
    else
      return null;
  }

我通过将打印语句放入onSaved（）函数中来测试了上面的代码，但成功验证后不会打印。

Answer 1

成功验证后，不会自动调用

onSaved（）函数。我们必须手动调用_formKey.currentState.save（）来保存变量。

Form(
  key: key,
  child: TextFormField(
    onSaved: (val) {
      print('saved');
    },
    validator: (val) {
      print('validating');
    },
  ),
),
RaisedButton(
  child: Text('Click me'),
  onPressed: () {
    if (key.currentState.validate()) {
      key.currentState.save();
      print('valid');
    }
  },
),

Answer 2

您是否调用了此方法 formKey.currentState.save() ？

在我的情况下，我在添加它后忘记调用它了。

成功验证后未调用Flutter TextFormField onSave（）

2 个答案: