Flutter 选中下拉搜索栏位置项时如何刷新ListView重新加载数据

实现方案 #

你需要做以下几处修改即可实现选中位置后刷新列表的需求：

1. 新增本地变量存储当前选中位置
   因为widget是不可变的，无法直接修改传入的selectedLocation，所以需要在State类中新增可变变量存储当前选中的位置，在initState中完成初始化：

class _SearchResultPageState extends State<SearchResultPage>
    with AutomaticKeepAliveClientMixin<SearchResultPage> {
  late ScrollController _scrollController;
  late FoodSearchViewModel viewModel;
  // 新增：存储当前选中的位置
  late TypeAheadModel _currentSelectedLocation;

  @override
  void initState() {
    super.initState();
    _scrollController = ScrollController()..addListener(_scrollListener);
    viewModel = FoodSearchViewModel();
    // 初始化当前选中位置
    _currentSelectedLocation = widget.selectedLocation;
    getData(_currentSelectedLocation);
  }

2. 修复原有方法的位置参数引用错误
   你当前的getData和loadMore方法都硬编码引用了widget.selectedLocation，导致就算位置变更拉取的还是最初进入页面的位置数据，需要改成引用我们刚新增的_currentSelectedLocation：

Future<List<DishModel>> getData(TypeAheadModel typeAheadModel) async {
  if (!viewModel.isLoading) {
    setState(() {
      viewModel.isLoading = true;
    });
    // 修改：用传入的参数拉取对应位置的数据
    var result = await viewModel.getData(typeAheadModel);
    setState(() {
      if (result.isEmpty || result.length == viewModel.totalCount) {
        viewModel.hasLoadMore = false;
      }
      viewModel.isLoading = false;
      viewModel.showShimmer = false;
    });
  }
  return viewModel.foodList;
}

Future<List<DishModel>> loadMore() async {
  if (!viewModel.isLoading) {
    if (_scrollController.position.extentAfter < 150) {
      setState(() {
        viewModel.isLoading = true;
      });
      // 修改：用当前选中的位置加载更多
      var moreItems = await viewModel.loadMore(_currentSelectedLocation);
      setState(() {
        if (moreItems.isEmpty ||
            viewModel.foodList.length == viewModel.totalCount) {
          viewModel.hasLoadMore = false;
        }
        viewModel.isLoading = false;
      });
    }
    return viewModel.foodList;
  }
  return viewModel.foodList;
}

3. 在位置下拉的选中回调中触发刷新
   给你顶部的位置下拉组件设置选中回调，选中新位置时执行以下操作即可：

// 替换为你实际使用的下拉组件的选中回调方法
onSelected: (TypeAheadModel newLocation) {
  // 1. 更新当前选中位置、重置旧数据
  setState(() {
    _currentSelectedLocation = newLocation;
    // 以下重置逻辑根据你的viewModel实际实现调整
    viewModel.foodList.clear();
    viewModel.hasLoadMore = true;
    viewModel.showShimmer = true;
  });
  // 2. 可选：将列表滚动回顶部提升体验
  _scrollController.jumpTo(0);
  // 3. 重新拉取新位置对应的数据
  getData(newLocation);
},

4. 可选：适配父组件更新传入位置的场景
   如果父组件可能会动态修改传入SearchResultPage的selectedLocation，需要重写didUpdateWidget方法监听变化，自动刷新：

@override
void didUpdateWidget(SearchResultPage oldWidget) {
  super.didUpdateWidget(oldWidget);
  // 检测传入的位置是否发生变化
  if (oldWidget.selectedLocation != widget.selectedLocation) {
    setState(() {
      _currentSelectedLocation = widget.selectedLocation;
      viewModel.foodList.clear();
      viewModel.hasLoadMore = true;
      viewModel.showShimmer = true;
    });
    _scrollController.jumpTo(0);
    getData(_currentSelectedLocation);
  }
}

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