如何在关注TextFormField时隐藏错误外观

Question

我使用TextFormField作为表单和自定义验证器方法来返回错误消息。当文本字段聚焦时，我试图在TextFormField上隐藏默认的错误消息和错误边框。

TextFormField(
focusNode: _focusNode,
validator: widget.validator,
errorBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 5.0),
borderRadius: BorderRadius.circular(5),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0),
borderSide: BorderSide(
color: const Color(0x1C707070),
width: 0.5,
),
)

我的问题是，当文本字段成为焦点时，错误边界会被覆盖。下划线变红了。我知道TextFormField就是这样工作的。

但我试图实现的是，当文本字段集中时，隐藏所有错误显示，包括错误消息。

Answer 1

我通过添加errorStyle&focusedErrorBorder。

errorBorder: UnderlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1.0),
),
errorStyle: _focusNode.hasFocus ? TextStyle(fontSize: 0, height: 0) : null,
focusedErrorBorder: UnderlineInputBorder(
borderSide: BorderSide.none,
),

Answer 2

接受的解决方案并不涵盖所有情况。更好的方法如下：

• 将Form的autovalidateMode属性设置为autovalidateMode.oUserInteraction
• 将kipValidation布尔属性添加为类中的标志(_S(
• 在验证器方法中，如果此标志为true，则返回null
• 在TextFormField中添加onChanged、onTap(可选(和onSaved函数。对于前两个，只需将_skipValidation设置为true，另一方面，在onSaved中将flag设置为false
• 最后，在调用currentState！之前！。validate((当用户提交表单时，请使用currentState！。save((来触发我们上面定义的onSaved方法