Flutter中如何跟踪列表变化并支持快速回退到任意历史状态？

你的原有实现存在两个核心问题：

1. 你直接将tracked_list的引用存入历史列表，Dart中列表是引用类型，后续修改tracked_list时，历史列表中存储的所有版本都会同步变更，根本无法记录真实历史状态。就算你改为每次全量拷贝存储（比如tracker_list.add(List.from(tracked_list))），也会带来第二个问题
2. 全量拷贝存储的内存占用会随历史版本数量线性增长，大列表场景下浪费非常严重，且回退、跳转版本的操作需要自行处理列表替换，逻辑繁琐效率低。

推荐方案：增量操作记录法 #

该方案不存储全量列表快照，仅记录每一步的操作类型和参数，回退时反向执行操作即可，内存占用极低、操作逻辑封装后调用非常简便。

实现代码 #

// 定义支持的列表操作类型
enum ListOperationType { add, removeAt, insert, update }

// 操作记录实体，存储操作必要参数
class ListOperation<T> {
  final ListOperationType type;
  final T? value;
  final int? index;
  final T? oldValue; // 仅更新操作需要存储旧值用于回退

  ListOperation({
    required this.type,
    this.value,
    this.index,
    this.oldValue,
  });
}

// 封装可回溯列表类
class TrackableList<T> {
  final List<T> _currentList = [];
  final List<ListOperation<T>> _operationHistory = [];
  int _currentHistoryIndex = -1; // 历史指针，支持撤销/重做逻辑

  // 对外暴露只读的当前列表，避免外部直接修改内部状态
  List<T> get current => List.unmodifiable(_currentList);

  // 示例：实现add操作，自动记录历史
  void add(T value) {
    // 如果之前执行过撤销，新操作会覆盖指针后的历史
    if (_currentHistoryIndex < _operationHistory.length - 1) {
      _operationHistory.removeRange(_currentHistoryIndex + 1, _operationHistory.length);
    }
    _currentList.add(value);
    _operationHistory.add(ListOperation(type: ListOperationType.add, value: value));
    _currentHistoryIndex++;
  }

  // 示例：实现removeAt操作，自动记录历史
  void removeAt(int index) {
    if (_currentHistoryIndex < _operationHistory.length - 1) {
      _operationHistory.removeRange(_currentHistoryIndex + 1, _operationHistory.length);
    }
    final removedValue = _currentList.removeAt(index);
    _operationHistory.add(ListOperation(
      type: ListOperationType.removeAt,
      index: index,
      value: removedValue,
    ));
    _currentHistoryIndex++;
  }

  // 回退上一步
  void undo() {
    if (_currentHistoryIndex < 0) return;
    final operation = _operationHistory[_currentHistoryIndex];
    switch (operation.type) {
      case ListOperationType.add:
        _currentList.removeLast();
        break;
      case ListOperationType.removeAt:
        _currentList.insert(operation.index!, operation.value as T);
        break;
      // 其他操作的回退逻辑按同理补充即可
      default:
        break;
    }
    _currentHistoryIndex--;
  }

  // 重做下一步
  void redo() {
    if (_currentHistoryIndex >= _operationHistory.length - 1) return;
    _currentHistoryIndex++;
    final operation = _operationHistory[_currentHistoryIndex];
    switch (operation.type) {
      case ListOperationType.add:
        _currentList.add(operation.value as T);
        break;
      case ListOperationType.removeAt:
        _currentList.removeAt(operation.index!);
        break;
      default:
        break;
    }
  }

  // 直接跳转到指定历史版本，参数为对应历史步数（0为初始状态）
  void jumpTo(int targetStep) {
    if (targetStep < 0 || targetStep >= _operationHistory.length) return;
    while (_currentHistoryIndex > targetStep) {
      undo();
    }
    while (_currentHistoryIndex < targetStep) {
      redo();
    }
  }
}

使用示例 #

final trackList = TrackableList<int>();
trackList.add(1);
trackList.add(2);
print(trackList.current); // 输出 [1,2]
trackList.undo();
print(trackList.current); // 输出 [1]
trackList.redo();
print(trackList.current); // 输出 [1,2]
trackList.jumpTo(0);
print(trackList.current); // 输出 []

高频跨版本跳转优化 #

如果你需要频繁跳转到间隔很远的历史版本，不想一步步执行undo/redo，可以搭配增量快照优化：每执行10-20次操作存一次全量列表快照，跳转时先定位到最近的快照，再执行少量操作即可到达目标版本，兼顾内存占用和跳转效率。

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