Flutter - TextField 失去焦点的价值

Question

我在一个容器中有两个 TextField。第一个定义为TextInputType.text，第二个是TextInputType.number。每当我改变焦点（First<>Second 或 Second<>First）时，TextField失去焦点的 也失去了它的价值。

奇怪的是，如果我将两个 textFields 都定义为TextInputType.text，则两个 textFields 都可以工作，如果我将其中一个设置为任何 but TextInputType.text，则在焦点输出时都会丢失键入的值。

很烦人。我不知道为什么会发生这种情况。

这是一个 Flutter 错误还是我做错了什么？

这是小部件代码：

class LoginInput extends StatelessWidget {
  final String hintText;
  final IconData icon;
  final String iconTag;
  final TextEditingController controller;
  final TextInputType inputType;
  final bool obscureText;

  LoginInput(this.hintText, this.icon, this.iconTag, this.controller,
      this.inputType, this.obscureText);

  @override
  Widget build(BuildContext context) {
    return new Column(children: <Widget>[
      new Container(
          height: 56.0,
          child: new Material(
              borderRadius: BorderRadius.all(Radius.circular(5.0)),
              elevation: 0.0,
              color: Colors.white,
              child: new Container(
                  child: new ListTile(
                leading: new Hero(
                    tag: iconTag, child: new Icon(icon, color: Colors.black)),
                title: new TextField(

                  keyboardType: inputType,
                  obscureText: obscureText,
                  textInputAction: TextInputAction.send,
                  controller: controller,
                  decoration: new InputDecoration(
                    border: InputBorder.none,
                    hintText: hintText,
                  ),
                  style: new TextStyle(
                      color: Colors.black,
                      fontSize: 18.0,
                      fontFamily: 'Caecilia',
                      fontWeight: FontWeight.w500),
                ),
              )))),
      new Divider(height: 0.0, color: Theme.of(context).dividerColor),
    ]);
  }
}

这是如何调用的：

  final LoginInput nameField = new LoginInput("Full name", Icons.face, "leading_icon_name", new TextEditingController(), TextInputType.text,false);

  final LoginInput birthField = new LoginInput("Birth date", Icons.date_range, "leading_icon_birth", new TextEditingController(), TextInputType.number, false);

Answer 1

如果你移动你的

final TextEditingController controller;

在类之外，TextField 的内容不会在每次 TextField 失去焦点时重置。

将此应用于您的代码：

final TextEditingController controller;

class LoginInput extends StatelessWidget {
  final String hintText;
  final IconData icon;
  final String iconTag;
  final TextInputType inputType;
  final bool obscureText;

  LoginInput(this.hintText, this.icon, this.iconTag, this.inputType, this.obscureText);

  @override
  Widget build(BuildContext context) {
    return new Column(children: <Widget>[
      new Container(
          height: 56.0,
          child: new Material(
              borderRadius: BorderRadius.all(Radius.circular(5.0)),
              elevation: 0.0,
              color: Colors.white,
              child: new Container(
                  child: new ListTile(
                leading: new Hero(
                    tag: iconTag, child: new Icon(icon, color: Colors.black)),
                title: new TextField(

                  keyboardType: inputType,
                  obscureText: obscureText,
                  textInputAction: TextInputAction.send,
                  controller: controller,
                  decoration: new InputDecoration(
                    border: InputBorder.none,
                    hintText: hintText,
                  ),
                  style: new TextStyle(
                      color: Colors.black,
                      fontSize: 18.0,
                      fontFamily: 'Caecilia',
                      fontWeight: FontWeight.w500),
                ),
              )))),
      new Divider(height: 0.0, color: Theme.of(context).dividerColor),
    ]);
  }
}

Answer 2

我刚刚遇到了同样的问题，解决方案是将我的 Widget 从 aStateless转换为Statefulone。

此线程中的最后一条评论可能对您的问题有所帮助。