Question

以下代码将按预期构建并运行-当用户键入内容时，将显示一条错误消息，直到字符串通过电子邮件验证格式为止。

Widget emailField(){
return StreamBuilder(
  stream: bloc.emailStream,
  builder: (BuildContext context, snapshot) {
    return TextField(
      keyboardType: TextInputType.emailAddress,
      decoration: InputDecoration(
        hintText: 'you@example.com',
        labelText: 'E-mail address',
        errorText: snapshot.error
      ),
      onChanged: (newValue){
        bloc.updateEmail(newValue);
      },
    );
  },
);

}

有人告诉我，当流更改时，将调用builder字段，该字段将重建TextField。但是，如果是这种情况，TextField是否不应该总是有一个空白字符串？相反，它保留了其价值。

我试图了解这里到底发生了什么。谢谢！

Answer 1

并非如此，如果您查看TextField的代码，就会发现它是一个StatefulWidget，因此它具有一个State（状态），并且state保持该值。

 class TextField extends StatefulWidget

此外，您可以使用TextEditingController来处理（获取/清除/设置）TextField的数据，如果您不提供TextEditingController，则会默认创建如您在源代码中所见。

 @override
 void initState() {
   super.initState();
   if (widget.controller == null)
     _controller = TextEditingController();
 }

您可以在此处找到更多信息：https://flutter.io/cookbook/forms/text-field-changes/

Answer 2

TextField 小工具是新创建的，但是它对应的 element 被重用/回收了（状态也是如此）。

以下是创建者的一个很好的解释：https://youtu.be/AqCMFXEmf3w?t=99

StreamBuilder子小部件交互

2 个答案: