Flutter中TypeAheadField如何随Dropdown选择动态更新候选列表？

问题核心在于：切换Dropdown选项时，若TypeAheadField输入框为空，默认不会触发suggestionsCallback重新获取数据，导致候选列表停留在旧分类的内容。

方案一：使用SuggestionsController（推荐） #

通过SuggestionsController手动触发候选列表的刷新，无需重建组件，性能更优。

1. 在State类中添加SuggestionsController并处理销毁：

class InputAndPicturePickerState extends State<InputAndPicturePicker> {
  final TextEditingController _controller = TextEditingController();
  final SuggestionsController<String> _suggestionsController = SuggestionsController(); // 新增控制器

  String? selectedCategory;
  String? selectedItem;
  List<String> items = [];

  @override
  void dispose() {
    _suggestionsController.dispose(); // 销毁控制器
    _controller.dispose();
    super.dispose();
  }

2. 给TypeAheadField绑定该控制器：

TypeAheadField<String>(
  suggestionsController: _suggestionsController, // 绑定建议控制器
  controller: _controller,
  builder: (context, controller, focusNode) => TextField(
    // ... 原TextField代码不变
  ),
  suggestionsCallback: (pattern) {
    // ... 原回调逻辑不变
  },
  // ... 其他属性不变
)

3. 在Dropdown的onChanged中手动刷新候选列表：

DropdownButton<String>(
  // ... 其他属性不变
  onChanged: (value) {
    setState(() {
      _controller.text = "";
      selectedCategory = value;
    });
    _suggestionsController.refresh(); // 刷新候选列表
  },
)

方案二：通过Key重建TypeAheadField #

当分类切换时，通过ValueKey让TypeAheadField重新构建，从而自动刷新候选列表。

直接修改TypeAheadField的key属性：

TypeAheadField<String>(
  key: ValueKey(selectedCategory), // 依赖分类值的Key
  controller: _controller,
  // ... 其他属性不变
)

方案对比 #

• 方案一：仅刷新候选数据，不重建组件，性能更好，适合复杂场景。
• 方案二：实现简单，但会重建TypeAheadField，适合轻量场景。

内容的提问来源于stack exchange，提问作者Mike