如何解决Flutter下拉列表,在验证错误时选择被禁用
验证工作正常,但是如果验证错误,则不能选择on选项。
DropdownButtonFormField(
isExpanded: true,hint: Text('Gender'),value: _selectedGender,onChanged: (newValue) {
setState(() {
_selectedGender = newValue;
});
},items: _gender.map((gender) {
return DropdownMenuItem(
child: new Text(gender),value: gender,);
}).toList(),validator: (value) {
if (value == null)
return "Please select your gender";
return null;
},),
以上代码位于页面视图中,
我的变量
List<String> _gender = ['Male','Female'];
String _selectedGender;
我的整个表单代码:只是将很长的一个字段简化为一个字段
class SignUp extends StatefulWidget {
@override
_SignUpState createState() => _SignUpState();
}
class _SignUpState extends State<SignUp> {
final List<GlobalKey<FormState>> _page = [
GlobalKey<FormState>(),GlobalKey<FormState>(),];
final _key = GlobalKey<ScaffoldState>();
List<String> _gender = ['Male','Female'];
String _selectedGender;
void changePage() {
if (currentPageValue < 3) {
if (_page[currentPageValue].currentState.validate()) {
setState(() {
currentPageValue += 1;
});
}
}
}
@override
Widget build(BuildContext context) {
var deviceSize = MediaQuery.of(context).size;
var deviceWidth = deviceSize.width;
return Scaffold(
key: _key,backgroundColor: _backgroundColor,appBar: AppBar(
backgroundColor: _backgroundColor,leading: IconButton(
icon: Icon(
currentPageValue == 0 ? Icons.close : Icons.keyboard_backspace,size: 20.0,color: _headerColor,onPressed: currentPageValue == 0
? () => Navigator.pop(context)
: () => back()),centerTitle: true,elevation: 0.0,body: Form(
key: _page[0],child: Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,children: <Widget>[
Container(
width: deviceWidth * 0.9,height: dropDownHeight,child: ButtonTheme(
child: DropdownButtonFormField(
isExpanded: true,onChanged: (newValue) {
setState(() {
_selectedGender = newValue;
});
},items: _gender.map((gender) {
return DropdownMenuItem(
child: new Text(gender),);
}).toList(),validator: (value) {
if (value == null) return "Please select your gender";
return null;
},RaisedButton(
color: buttonColor,shape: RoundedRectangleBorder(
borderRadius:
BorderRadius.circular(10.0),child: Text(
'Next',style: TextStyle(
color: Colors.white,fontWeight: FontWeight.w400,onPressed: () => changePage(),],);
解决方法
查看您的代码,强烈建议您创建3个不同的Form
并分别对其进行验证,因此在表单状态方面没有任何问题。为此,您只需将字段包装在各自的Form
中,并确保不要混合使用表单,也不要将它们放在另一个表单中。
下面是一个基于您的代码和我所说的例子:
class SignUp extends StatefulWidget {
@override
_SignUpState createState() => _SignUpState();
}
class _SignUpState extends State<SignUp> {
final _page1 = GlobalKey<FormState>();
final _page2 = GlobalKey<FormState>();
final _page3 = GlobalKey<FormState>();
final _key = GlobalKey<ScaffoldState>();
int currentPageValue;
List<String> _gender = ['Male','Female'];
String _selectedGender;
void changePage(GlobalKey<FormState> page) {
if (currentPageValue < 3) {
if (page.currentState.validate()) {
setState(() {
currentPageValue += 1;
});
}
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
key: _key,body: ListView(
children: <Widget>[
Form(
key: _page1,child: Column(
children: [
DropdownButtonFormField(
isExpanded: true,hint: Text('Gender'),value: _selectedGender,onChanged: (newValue) {
setState(() {
_selectedGender = newValue;
});
},items: _gender.map((gender) {
return DropdownMenuItem(
child: new Text(gender),value: gender,);
}).toList(),validator: (value) {
if (value == null) return "Please select your gender";
return null;
},),RaisedButton(
child: Text('Next'),onPressed: () => changePage(_page1),],Form(
key: _page2,child: Column(
children: [
// SomeField(
//
// ),// SomeOtherField(
//
// ),onPressed: () => changePage(_page2),);
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。