我的表单键不会在flutter中进行验证,即使在我将其用作表单中的键并输入合适的值之后也是如此



好的,我看到了关于这个错误的帖子,但我不明白为什么我的_formKey没有验证。我在Form中的key参数中使用了它,但它没有验证。

我是怎么想出来的?我只是在函数中使用了一个if语句,它位于给定代码的最后(即第142行(。我用过

if(_formKey.currentState!.validate())
print("Yes");

我什么也没得到。所以,请有人告诉我,我在哪里遗漏了一点。我在下面写行号,这可能会很有帮助,并节省一些时间-

第-24、51、74、82、94、100、142行。

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:email_validator/email_validator.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_instagram_clone_final/Screens/signup/cubit/signup_cubit.dart';
import 'package:flutter_instagram_clone_final/repositories/auth/auth_repository.dart';
class SignupScreen extends StatelessWidget {
static const String routeName = '/signup';
static Route route() {
return MaterialPageRoute(
settings: const RouteSettings(
name: routeName,
),
builder: (context) => BlocProvider<SignupCubit>(
create: (_) => SignupCubit(authRepository: context.read<AuthRepository>()),
child: SignupScreen(),
),
);
}
final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
return WillPopScope(
onWillPop: () async => false,
child: GestureDetector(
onTap: () => FocusScope.of(context).unfocus(),
child: BlocConsumer<SignupCubit, SignupState>(
listener: (context, state) {
if(state.status==SignupStatus.error)
showDialog(context: context, builder: (context) => AlertDialog(
title: Text('Error'),
content: Text(state.failure.message),),
);
},
builder: (context, state) {
return Scaffold(
resizeToAvoidBottomInset: false,
body: Center(
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Card(
color: Colors.white,
child: Padding(
padding: const EdgeInsets.all(24.0),
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'Instagram',
style: TextStyle(
fontSize: MediaQuery.of(context).size.width*0.075,
fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
const SizedBox(
height: 12.0,
),
TextFormField(
autovalidateMode: AutovalidateMode.always,
decoration: InputDecoration(
hintText: "Enter the username",
),
onChanged: (value) => context.read<SignupCubit>().usernameChanged(value),
validator: (value) => value!.trim().isNotEmpty ? "" : 'Please enter a valid email',
),
TextFormField(
autovalidateMode: AutovalidateMode.always,
decoration: InputDecoration(
hintText: "Enter the email",
),
onChanged: (value) => context.read<SignupCubit>().emailChanged(value),
validator: (value) => EmailValidator.validate(value??"") ? "" : 'Please enter a valid email',
),
const SizedBox(
height: 12.0,
),
TextFormField(
obscureText: true,
autovalidateMode: AutovalidateMode.always,
decoration: InputDecoration(
hintText: "Enter the password",
),
onChanged: (value) => context.read<SignupCubit>().passwordChanged(value),
validator: (value) => value!.length<6 ? "Must be at least 6 characters" : '',
),
const SizedBox(
height: 20.0,
),
ElevatedButton(
onPressed: () => _submitForm(context, state.status==SignupStatus.submitting),
style: ElevatedButton.styleFrom(
primary: Theme.of(context).primaryColor,
elevation: 1.0,
textStyle: TextStyle(
color: Colors.white,
),
),
child: Text(
'Sign Up',
),
),
const SizedBox(
height: 12.0,
),
ElevatedButton(
onPressed: () => Navigator.of(context).pop(),
style: ElevatedButton.styleFrom(
primary: Colors.grey[200],
elevation: 1.0,
),
child: Text(
'Already have an account? Log In',
style: TextStyle(
color: Colors.black,
),
),
),
],
),
),
),
),
),
),
);
}
),
),
);
}
void _submitForm(BuildContext context, bool isSubmitting) {
print('${_formKey.currentState} $isSubmitting');
if(_formKey.currentState!.validate() && !isSubmitting)
context.read<SignupCubit>().signupWithCredentials();
}
}

第页。S.:我输入的电子邮件、密码和用户名分别为-S@S.com、123456和Sf作为示例。所以我认为我输入的值是正确的,还有其他一些问题。

在vaidator回调中,当验证工作时,您必须返回null,这是因为验证不工作

TextFormField(
obscureText: true,
autovalidateMode: AutovalidateMode.always,
decoration: InputDecoration(
hintText: "Enter the password",
),
onChanged: (value) => context.read<SignupCubit>().passwordChanged(value),
// Return null in validator when the validation is ok
validator: (value) =>
value!.length < 6 ? "Must be at least 6 characters" : null,
)

如果返回null,那么验证器将返回true,并且打印应该被称为

最新更新