如何解决BLoC中‘Don’t use BuildContext's across async gaps’警告

方案1：将UI操作转移到UI层（推荐） #

Bloc的核心职责是处理业务逻辑和管理状态，路由、SnackBar这类UI操作应该交给UI层处理，完全避免在Bloc中传递和使用BuildContext。

Bloc层修改：只负责状态分发

if (event is AuthenticationLogout) {
  emit(AuthenticationLoading());
  try {
    user = await _repository.getUserDetails();
    final response = await _repository.logout(user!.token);
    if (response == 1) {
      emit(AuthenticationNotAuthenticated());
    } else {
      emit(const AuthenticationError(message: LocaleKeys.try_again_message));
    }
  } catch (e) {
    emit(const AuthenticationError(message: LocaleKeys.try_again_message));
  }
}

UI层监听状态执行操作

在你的页面组件中使用BlocListener监听Bloc状态变化，触发路由或SnackBar：

BlocListener<AuthenticationBloc, AuthenticationState>(
  listener: (context, state) {
    if (state is AuthenticationNotAuthenticated) {
      Navigator.pushNamedAndRemoveUntil(
        context,
        RouteConstants.rcLogin,
        (Route<dynamic> route) => false,
      );
    } else if (state is AuthenticationError) {
      ScaffoldMessenger.of(context)
        ..removeCurrentSnackBar()
        ..showSnackBar(SnackBar(
          content: Text(state.message.tr()),
          backgroundColor: Colors.red,
        ));
    }
  },
  child: // 你的页面UI组件
)

方案2：封装独立服务类处理UI操作 #

把路由、SnackBar逻辑封装成全局服务，Bloc依赖这些服务而非BuildContext，既隔离UI逻辑，又避免跨异步的context问题。

1. 创建导航服务

class NavigationService {
  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();

  Future<void> navigateToLogin() {
    return navigatorKey.currentState!.pushNamedAndRemoveUntil(
      RouteConstants.rcLogin,
      (Route<dynamic> route) => false,
    );
  }
}

2. 创建SnackBar服务

class SnackBarService {
  void showErrorSnackBar(String message) {
    final context = NavigationService().navigatorKey.currentContext;
    if (context != null) {
      ScaffoldMessenger.of(context)
        ..removeCurrentSnackBar()
        ..showSnackBar(SnackBar(
          content: Text(message.tr()),
          backgroundColor: Colors.red,
        ));
    }
  }
}

3. Bloc中注入服务并使用

class AuthenticationBloc extends Bloc<AuthenticationEvent, AuthenticationState> {
  final AuthenticationRepository _repository;
  final NavigationService _navigationService;
  final SnackBarService _snackBarService;

  AuthenticationBloc(
    this._repository,
    this._navigationService,
    this._snackBarService
  ) : super(AuthenticationInitial()) {
    on<AuthenticationLogout>((event, emit) async {
      emit(AuthenticationLoading());
      try {
        user = await _repository.getUserDetails();
        final response = await _repository.logout(user!.token);
        if (response == 1) {
          emit(AuthenticationNotAuthenticated());
          await _navigationService.navigateToLogin();
        } else {
          _snackBarService.showErrorSnackBar(LocaleKeys.try_again_message);
        }
      } catch (e) {
        _snackBarService.showErrorSnackBar(LocaleKeys.try_again_message);
      }
    });
  }
}

4. 在main中绑定导航key

void main() {
  final navigationService = NavigationService();
  runApp(
    MaterialApp(
      navigatorKey: navigationService.navigatorKey,
      // 其他配置项
    ),
  );
}

方案3：应急方案——检查Context是否挂载（不推荐） #

如果暂时无法重构代码，可以先通过检查context是否还在组件树中来规避警告，但这只是临时解决方案，不符合Bloc架构设计原则。

1. 写一个判断挂载状态的扩展

extension ContextExtension on BuildContext {
  bool get isMounted {
    try {
      widget;
      return true;
    } catch (_) {
      return false;
    }
  }
}

2. 在Bloc中使用判断

if (event is AuthenticationLogout) {
  emit(AuthenticationLoading());
  try {
    user = await _repository.getUserDetails();
    final response = await _repository.logout(user!.token);
    if (response == 1) {
      emit(AuthenticationNotAuthenticated());
      if (event.context.isMounted) {
        Navigator.pushNamedAndRemoveUntil(
          event.context,
          RouteConstants.rcLogin,
          (Route<dynamic> route) => false
        );
      }
    } else {
      if (event.context.isMounted) {
        ScaffoldMessenger.of(event.context)
          ..removeCurrentSnackBar()
          ..showSnackBar(SnackBar(
              content: Text(LocaleKeys.try_again_message.tr()),
              backgroundColor: Colors.red));
      }
    }
  } catch (e) {
    if (event.context.isMounted) {
      ScaffoldMessenger.of(event.context)
        ..removeCurrentSnackBar()
        ..showSnackBar(SnackBar(
            content: Text(LocaleKeys.try_again_message.tr()),
            backgroundColor: Colors.red));
    }
  }
}

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