如何在 Flutter 中清除输入文本答案

【问题标题】：How to clear in put text in Flutter如何在 Flutter 中清除输入文本
【发布时间】：2021-06-10 18:15:39
【问题描述】：

我正在尝试在用户单击 X 图标时清除文本，当我单击它时我的搜索结果为空，但我的输入文本仍然存在，所以如果我能得到任何帮助或建议，我将不胜感激关于如何清除输入的文本。

                  Expanded(
                      flex: 8,
                      child: GestureDetector(
                        onTap: () {},
                        child: TextFormField(
                          autofocus: true,
                          enabled: true,
                          onChanged: (va) {
                            filterSearchResult(va, model);
                          },
                          decoration: InputDecoration(
                              floatingLabelBehavior:
                                  FloatingLabelBehavior.never,
                              border: InputBorder.none,
                              hintStyle: TextStyle(
                                  color:
                                      Theme.of(context).secondaryHeaderColor)),
                        ),
                      )),
                  Expanded(
                    child: GestureDetector(
                        onTap: () {
                          setState(() {
                            items.clear();
                            itemList.clear();
                          });
                        },
                        child: Image.asset(
                          "assets/icons/cancel.png",
                          color: Theme.of(context).secondaryHeaderColor,
                          height: 30,
                        )),
                  ),

【问题讨论】：

标签： flutter dart flutter-layout flutter-dependencies flutter-web

【解决方案1】：

您应该使用TextEditingController 清除TextFormField 的值。

// Some code ...

final textEditingController = TextEditingController();

// Some code ...

Expanded(
  flex: 8,
  child: GestureDetector(
    onTap: () {},
    child: TextFormField(
      autofocus: true,
      enabled: true,
      controller: textEditingController, // Your TextEditingController here
      onChanged: (va) {
        filterSearchResult(va, model);
      },
      decoration: InputDecoration(
        floatingLabelBehavior: FloatingLabelBehavior.never,
        border: InputBorder.none,
        hintStyle:
        TextStyle(color: Theme.of(context).secondaryHeaderColor),
      ),
    ),
  ),
),
Expanded(
  child: GestureDetector(
    onTap: () {
      setState(() {
        textEditingController.clear(); // Clear the TextFormField
        items.clear();
        itemList.clear();
      });
    },
    child: Image.asset(
      "assets/icons/cancel.png",
      color: Theme.of(context).secondaryHeaderColor,
      height: 30,
    ),
  ),
),

【讨论】：

【解决方案2】：

我使用 TextEditingController myController 并将 myController.text 设置为 null

【讨论】：