在 Flutter 中弹出时清除 TextField 中的文本

Question

我有一个 SearchText TextField。由于一切正常，我想知道当我回到同一页面时如何清除文本字段中的文本。现在，当我从页面返回时，搜索文本仍然存在。

条件：我正在将字段中的值传递到其他页面。所以搜索文本应该有一些文本。

我目前所做的是：

尝试在推送发生后将文本设置为空。（我有转到另一页的按钮）

onPressed: (){
   Navigator.push(context, new MaterialPageRoute(
     builder: (context) => SearchPage(searchText: this.search.text)
   ));
   setState((){this.search.text = '';});
}

发生问题：在将数据推送到另一个页面之前，搜索文本变为空。我不想要的。

试图在我的 initState() 中将文本设置为 null，但弹出只是替换删除堆栈而不是重做页面。所以页面不会调用 initState()

我也试过这样做：

Navigator.of(context).pop('NoText': '');

但我不知道在主页上搜索文本要做什么，或者更新它。

我不想再次推送，因为它会将相同的页面再次添加到堆栈中。

Page 1 -> Page 2 (press back) -> Page 1 (search text = '')

如有任何帮助，我们将不胜感激。谢谢:)

Answer 1

将 TextEditingController 添加到您的 TextField 并仅在推送其他页面后调用 controller.clear()。

这可以通过在 onPressed 函数中使用 await 来完成，或者如果您希望避免使 onPressed 函数 async.

例子-

//Initialize a controller inside your State class
TextEditingController _controller = TextEditingController();

//Set the _controller on you TextField
TextField(
  controller: _controller,
  //Rest of your code
)

//Clear the controller after pushing the new page
onPressed: () {
   Navigator.push(context, new MaterialPageRoute(
     builder: (context) => SearchPage(searchText: this.search.text)
   )).then((value) {
      //This makes sure the textfield is cleared after page is pushed.
      _controller.clear();
   });
}

如果有帮助请告诉我！

Answer 2

这是销毁弹出窗口中任何小部件的最好和最简单的方法，而且它可以毫不费力地工作。

dispose() 方法在我们弹出任何屏幕时都会被调用。了解更多信息：- dispose 方法

class _LoginScreenState extends State<LoginScreen> {

  TextEditingController userIDTextField = TextEditingController();
  TextEditingController passwordTextField = TextEditingController();

  final FocusNode userIDFocus = FocusNode();
  final FocusNode passwordFocus = FocusNode();
  bool showPassword = false;

  // TODO: initState
  @override
  void initState() {
    super.initState();
 }

 // TODO: dispose
 @override
 void dispose() {
   userIDTextField.clear();
   passwordTextField.clear();
   super.dispose();
 }
}

在 Flutter 中弹出时清除 TextField 中的文本

Clear text in the TextField when pop in Flutter

uitextfield

flutter