我已经创建了一个自动完成的文本字段:
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 文件时,它会给我一些建议。 现在,每当我选择它必须清除框的值时,我想要什么。
最佳答案
为了实现这一点,我们应该可以访问文本编辑 Controller ,这样你就可以做一些类似于访问自动完成中的文本编辑 Controller 的事情
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),
);
},
);
}
}
关于flutter - 在 flutter 中选择后清除自动完成文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72602087/