Flutter Bloc中ListView搜索后清空输入无法恢复原列表的解决方法

核心问题原因 #

你当前的搜索逻辑存在致命问题：每次处理SearchEvent时，都是从当前状态的过滤后列表里重新过滤，而非基于原始全量数据。当你输入关键词后，状态里的列表已经是缩小后的子集，清空输入时再从这个子集恢复，自然拿不到最初的完整数据。

解决方案 #

在Bloc中单独保存一份原始全量数据，所有搜索操作都基于这份原始数据进行过滤，清空时直接返回原始数据即可。

修改后的代码示例 #

1. 在Bloc类中添加原始数据存储

class OverallAttendanceBloc extends Bloc<OverallAttendanceEvent, OverallAttendanceState> {
  // 用于保存原始全量考勤数据
  List<OverallAttendanceModel>? _originalAttendance;

  OverallAttendanceBloc() : super(OverallAttendanceInitial()) {
    // 加载数据的事件（示例）
    on<LoadAttendanceEvent>((event, emit) async {
      // 替换成你实际的加载数据逻辑
      final loadedAttendance = await yourDataFetchMethod();
      // 保存原始全量数据
      _originalAttendance = loadedAttendance;
      emit(OverallAttendanceLoaded(attendance: loadedAttendance, date: ''));
    });

    // 修改后的搜索事件处理逻辑
    on<SearchEvent>((event, emit) {
      // 若原始数据未加载，直接返回空列表
      if (_originalAttendance == null) {
        emit(OverallAttendanceLoaded(attendance: [], date: ''));
        return;
      }

      List<OverallAttendanceModel> filteredAttendance;
      // 判断搜索内容是否为空
      if (event.search.trim().isEmpty) {
        // 清空时直接使用原始全量数据（注意用List.from创建副本，避免状态引用问题）
        filteredAttendance = List.from(_originalAttendance!);
      } else {
        // 基于原始数据进行过滤
        filteredAttendance = _originalAttendance!
            .where((element) =>
                element.name!.toLowerCase().contains(event.search.toLowerCase()))
            .toList();
      }
      emit(OverallAttendanceLoaded(attendance: filteredAttendance, date: ''));
    });
  }
}

2. TextField部分无需修改

你的TextField的onChanged逻辑是正常的，不需要调整：

TextField(
  onChanged: (value) {
    _overallAttendanceBloc.add(SearchEvent(search: value));
  },
),

关键说明 #

• 必须保留原始全量数据的副本，不能依赖当前状态的列表做后续过滤，否则会导致数据逐步丢失。
• 使用List.from(_originalAttendance!)创建副本，避免直接引用同一个列表对象导致状态更新异常（Bloc依赖状态对象的变化来触发UI更新）。

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