如何简化Flutter Bloc（Cubit）状态管理中的异步功能？

我之前用Riverpod 2.0，现在正在探索flutter_bloc的Cubit状态管理方案，想基于它实现异步功能。发现Cubit和Riverpod的Notifier类类似，但找不到对应AsyncNotifier的组件——也就是那种内置支持加载、数据、错误这类异步状态的工具。

现在在Cubit里实现异步功能，似乎得自己创建包含加载、成功、失败状态的自定义状态类，这会产生大量样板代码，尤其是异步操作多的时候。想问有没有更简便的方式，还是每个异步功能都得单独写状态类？

参考示例 #

Riverpod AsyncNotifier 实现（内置异步状态）

class AsyncTodosNotifier extends AsyncNotifier<List<Todo>> {
  @override
  Future<List<Todo>> build() async {
    // 从远程仓库加载初始待办列表
    return _fetchTodo();
  }

  Future<void> addTodo(Todo todo) async {
    // 设置状态为加载中
    state = const AsyncValue.loading();
    // 添加新待办并重新加载列表
    state = await AsyncValue.guard(() async {
      await http.post('api/todos', todo.toJson());
      return _fetchTodo();
    });
  }
}

自定义状态类的Cubit实现

class ComplexListCubit extends Cubit<ComplexListState> {
  Future<void> fetchList() async {
    try {
      emit(ComplexListState.loading());
      final items = await repository.fetchItems();
      emit(ComplexListState.success(items));
    } on Exception {
      emit(const ComplexListState.failure());
    }
  }
}

简化方案：无需每个异步功能单独建状态类 #

1. 定义通用异步状态类

创建一个适配任意数据类型的通用状态类，所有需要处理异步逻辑的Cubit都能复用它：

abstract class AsyncState<T> {}

// 加载中状态
class AsyncLoading<T> extends AsyncState<T> {}

// 成功状态，携带数据
class AsyncSuccess<T> extends AsyncState<T> {
  final T data;
  AsyncSuccess(this.data);
}

// 错误状态，携带错误信息
class AsyncError<T> extends AsyncState<T> {
  final String message;
  AsyncError(this.message);
}

2. 在Cubit中复用通用状态

直接用通用状态类定义Cubit，不用再为每个业务写专属状态：

class TodosCubit extends Cubit<AsyncState<List<Todo>>> {
  TodosCubit() : super(AsyncLoading()) {
    // 初始化时加载数据
    fetchTodos();
  }

  Future<void> fetchTodos() async {
    emit(AsyncLoading());
    try {
      final todos = await _fetchTodo();
      emit(AsyncSuccess(todos));
    } on Exception catch (e) {
      emit(AsyncError(e.toString()));
    }
  }

  Future<void> addTodo(Todo todo) async {
    emit(AsyncLoading());
    try {
      await http.post('api/todos', todo.toJson());
      final todos = await _fetchTodo();
      emit(AsyncSuccess(todos));
    } on Exception catch (e) {
      emit(AsyncError(e.toString()));
    }
  }

  // 模拟远程获取数据
  Future<List<Todo>> _fetchTodo() async {
    // 实际业务逻辑
    return [];
  }
}

3. 封装通用异步逻辑（进一步减少样板）

通过扩展方法把重复的emit+try/catch逻辑抽出来，让Cubit代码更简洁：

// 给Cubit扩展通用异步方法
extension CubitAsyncExtension<T> on Cubit<AsyncState<T>> {
  Future<void> runAsync(Future<T> Function() action) async {
    emit(AsyncLoading<T>());
    try {
      final data = await action();
      emit(AsyncSuccess(data));
    } on Exception catch (e) {
      emit(AsyncError(e.toString()));
    }
  }
}

之后Cubit里的异步方法可以简化成这样：

class TodosCubit extends Cubit<AsyncState<List<Todo>>> {
  TodosCubit() : super(AsyncLoading()) {
    // 直接调用扩展方法
    runAsync(_fetchTodo);
  }

  Future<void> addTodo(Todo todo) async {
    runAsync(() async {
      await http.post('api/todos', todo.toJson());
      return _fetchTodo();
    });
  }

  Future<List<Todo>> _fetchTodo() async {
    return [];
  }
}

4. UI层统一处理通用状态

用BlocBuilder的时候，直接判断通用状态类型即可，不用为每个业务写不同的分支：

BlocBuilder<TodosCubit, AsyncState<List<Todo>>>(
  builder: (context, state) {
    if (state is AsyncLoading) {
      return const Center(child: CircularProgressIndicator());
    } else if (state is AsyncSuccess) {
      return ListView.builder(
        itemCount: state.data.length,
        itemBuilder: (context, index) => ListTile(title: Text(state.data[index].title)),
      );
    } else if (state is AsyncError) {
      return Center(child: Text('加载失败：${state.message}'));
    }
    return const SizedBox();
  },
)

总结 #

• 不用为每个异步功能单独创建状态类，通用异步状态类可以在所有Cubit中复用
• 通过扩展方法封装异步逻辑，彻底消除重复的try/catch和emit代码
• UI层统一处理状态分支，保持代码一致性和简洁性

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