如何修复颤振网页文本表单字段不接受或响应输入?

Question

我创建了这个代码片段来在颤振 Web 应用程序中创建一个登录 Web 表单，其中我使用了 TextFormField，它显示得很好，但是当我尝试在此字段中输入任何字符时，它没有响应并且没有输入，请问如何解决这个问题？

class LoginForm extends StatefulWidget {
@override
LoginFormState createState() {
return LoginFormState();
}
}
class LoginFormState extends State<LoginForm> {
final _formKey = GlobalKey<FormState>();
@override
Widget build(BuildContext context) {
// TODO: implement build
return Form(
key: _formKey,
child: Column(children: <Widget>[
Row(children: <Widget>[
// Email input field
Container(
width: 120.0,
child: Text(
"Email: *",
textAlign: TextAlign.left,
style: TextStyle(
color: Colors.black,
fontSize: 18.0,
fontWeight: FontWeight.w500,
fontFamily: 'Merriweather',
),
),
),
SizedBox(
width: 40.0,
),
Container(
width: MediaQuery.of(context).size.width / 4.0,
child: TextFormField(
keyboardType: TextInputType.emailAddress,
cursorColor: Colors.black,
style: TextStyle(
fontSize: 14.0,
),
decoration: InputDecoration(
hintText: 'e@x.y',
contentPadding: EdgeInsets.all(10.0),
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: Colors.black87,
),
borderRadius: BorderRadius.circular(10.0),
),
),
validator: (value) {
if (value.isEmpty) {
return "Please enter your email!";
}
return "yayyy";
},
),
),
])
]));
}
}

预期：用户可以在文本表单字段中输入 错误：用户无法输入任何输入，并且滚动仅保持闪烁

更新：这是孵化表单本身的代码，希望对您有所帮助。

import 'package:flutter_web/material.dart';
/*import 'package:login_page/widgets/agree.dart';
import 'package:login_page/widgets/gender.dart';
**/
import 'package:dart_flutter_web_preview/widgets/login_form.dart';
import 'home.dart';
class Login extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return Scaffold(
backgroundColor: Colors.white, // ignore: undefined_operator
body: Padding(
padding: EdgeInsets.only(
top: 60.0, bottom: 60.0, left: 120.0, right: 120.0),
child: Card(
// ignore: argument_type_not_assignable
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
elevation: 5.0,
child: Container(
child: Row(
children: <Widget>[
Container(
width: MediaQuery.of(context).size.width / 3.3,
height: MediaQuery.of(context).size.height,
color: Color(0xFFCFE8E4),
child: Padding(
padding:
EdgeInsets.only(top: 85.0, right: 50.0, left: 50.0),
child: Align(
alignment: Alignment.centerRight,
child: Column(
children: <Widget>[
SizedBox(height: 60),
Container(
padding: EdgeInsets.only(top: 20.0, bottom: 20.0),
//color: Colors.red,
child: Text(
'Go Ahead and Login',
style: TextStyle(
color: Colors.white,
fontSize: 30.0,
fontWeight: FontWeight.bold,
fontFamily: 'Merriweather',
),
),
),
SizedBox(height: 5),
Container(
padding: EdgeInsets.only(top: 5.0, bottom: 5.0),
//color: Colors.red,
child: Text(
'It should only take a couple of seconds to login to your account',
style: TextStyle(
color: Colors.white,
fontSize: 15.0,
fontFamily: 'Merriweather',
//fontWeight: FontWeight.bold,
),
textAlign: TextAlign.center,
),
),
SizedBox(
height: 30.0,
),
RaisedButton(
color: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5.0)),
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return Home();
}));
},
child: Text(
'Home',
style: TextStyle(
color: Colors.black,
fontSize: 20.0,
fontWeight: FontWeight.bold,
fontFamily: 'Merriweather',
),
),
),
],
),
),
),
),
Container(
padding: EdgeInsets.only(
top: 140.0, right: 30.0, left: 30.0, bottom: 5.0),
width: MediaQuery.of(context).size.width / 2.3,
height: MediaQuery.of(context).size.height,
child: Column(
children: <Widget>[
Text(
"Login",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w800,
fontSize: 35.0,
fontFamily: 'Merriweather',
),
//textAlign: TextAlign.end,
),
const SizedBox(
height: 30.0,
),
new LoginForm(),
],
),
),
],
),
),
),
));
} //Widget
} //

Answer 1

我尝试了您的代码，我遇到的唯一问题是在代码片段上您没有脚手架，但是由于我放置了脚手架，因此一切都按预期工作。

可能发生的情况是，每次您键入内容并且丢失数据时，您的小部件都会重建。你能给出整个代码吗？

Answer 2

我尝试按照其他有用的贡献者所提到的来升级我的颤振版本，它奏效了。因此，解决方案在于升级版本，因为添加了许多新更新。