在颤动中选择后清除自动完成文本？答案

【问题标题】：clear autocomplete text after selected in flutter?在颤动中选择后清除自动完成文本？
【发布时间】：2022-10-21 11:38:37
【问题描述】：

我创建了一个自动完成文本字段：

                Autocomplete(
                          optionsBuilder: (TextEditingValue textEditingValue){
                            if (textEditingValue.text.isEmpty){
                              return const Iterable<String>.empty();
                            }
                            else{
                              return autoCompleteData.where((word) => word.toLowerCase()
                                  .contains(textEditingValue.text.toLowerCase())
                              );
                            }
                          },
                          onSelected: (value) {
                            print("this is the value $value");
                            setState((){
                              selected=value.toString();
                            });
                            
                          }
                      ),

当我通过 json 文件键入时，这为我提供了一些价值。现在，每当我选择它必须清除该框的值时，我想要什么。

【问题讨论】：

清除盒子是什么意思？你能给我们更多的细节吗？就像您在选择单词/文本时想要清除单词或关闭建议框一样。

标签： flutter autocomplete

【解决方案1】：

我不能告诉你一个精确的解决方案，因为你没有共享所有代码，而是您可能应该将 textEditingValue 重新初始化为空字符串

setState((){
selected=value.toString();
//call a method that set textEditingValue = ""
        });

【讨论】：

【解决方案2】：

为了实现这一点，我们应该可以访问文本编辑控制器，因此您可以执行类似于访问自动完成中的文本编辑控制器的操作

late TextEditingController textEditingController;
        Autocomplete(
          optionsBuilder: (TextEditingValue textEditingValue) {
            if (textEditingValue.text.isEmpty) {
              return const Iterable<String>.empty();
            } else {
              return _allSpecialitySkills
                  .where((word) => word.name.toLowerCase().contains(textEditingValue.text.toLowerCase()));
            }
          },
          onSelected: (value) {
            print("this is the value $value");
            textEditingController.text = "";
          },
          fieldViewBuilder: (BuildContext context, TextEditingController fieldTextEditingController,
              FocusNode fieldFocusNode, VoidCallback onFieldSubmitted) {
            textEditingController = fieldTextEditingController;
            return TextField(
              controller: fieldTextEditingController,
              focusNode: fieldFocusNode,
              style: const TextStyle(fontWeight: FontWeight.bold),
            );
          },
        )

找到我为实现上述目标所做的简单项目，

List<String> countries = <String>[
  "Africa",
  "Antarctica",
  "Asia",
  "Australia",
  "Europe",
  "North America",
  "South America",
  "Srilanka",
  "India",
  "China",
  "Japan",
  "Koria",
  "Thai",
];

class AutoCompleteExample extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _AutoCompleteExampleState();
}

class _AutoCompleteExampleState extends State<AutoCompleteExample> {
  late TextEditingController textEditingController;
  @override
  Widget build(BuildContext context) {
    return Autocomplete(
      optionsBuilder: (TextEditingValue textEditingValue) {
        if (textEditingValue.text.isEmpty) {
          return const Iterable<String>.empty();
        } else {
          return countries.where((word) => word.toLowerCase().startsWith(textEditingValue.text.toLowerCase()));
        }
      },
      onSelected: (value) {
        print("this is the value $value");
        textEditingController.text = "";
      },
      fieldViewBuilder: (BuildContext context, TextEditingController fieldTextEditingController,
          FocusNode fieldFocusNode, VoidCallback onFieldSubmitted) {
        textEditingController = fieldTextEditingController;
        return TextField(
          controller: fieldTextEditingController,
          focusNode: fieldFocusNode,
          style: const TextStyle(fontWeight: FontWeight.bold),
        );
      },
    );
  }
}

【讨论】：