如何在Flutter不同Context间共享Bloc实例？

这个问题我之前也踩过坑！完全可以通过上下文访问到目标Bloc，问题出在你当前的BlocProvider实现逻辑，以及showDialog弹窗的上下文特性上，给你两种实用的解决方案：

原因分析 #

showDialog创建的弹窗是挂载到全局Overlay上的，它的上下文（也就是builder里的newContext）的祖先Widget链，和触发弹窗的页面Widget链是相互独立的。你当前的BlocProvider.of方法用context.ancestorWidgetOfExactType查找BlocProvider，这种方式只能在当前Widget子树里找，自然找不到页面里的那个BlocProvider。

方案一：传递原始上下文（快速解决） #

最简单的办法是，在触发弹窗时把按钮所在的原始上下文传给弹窗，用这个上下文去获取Bloc：

修改触发弹窗的代码 #

onPressed: () => showDialog(
  context: context,
  // 把当前页面的context传给EventDialog
  builder: (newContext) => EventDialog(parentContext: context),
).then( (val) => print(val) ),

修改EventDialog代码 #

class EventDialog extends StatelessWidget {
  final BuildContext parentContext;

  // 接收传入的原始上下文
  EventDialog({required this.parentContext});

  @override
  Widget build(BuildContext context) {
    // 用原始上下文获取Bloc
    _accountBloc = BlocProvider.of<AccountBloc>(parentContext);
    _userMenuItems = _accountBloc.usersInAccount
        .map((user) => DropdownMenuItem(
              child: Text(user.userName),
              value: user.userId,
            ))
        .toList();
    
    // 剩下的弹窗UI代码...
  }
}

方案二：升级BlocProvider实现（推荐，一劳永逸） #

这种方式更符合Flutter状态管理的最佳实践，把你的BlocProvider改成基于InheritedWidget的实现，官方推荐的dependOnInheritedWidgetOfExactType方法能跨子树查找BlocProvider，不管是弹窗还是新页面都能直接获取：

完整的改进版BlocProvider代码 #

import 'package:flutter/material.dart';

abstract class BlocBase {
  void dispose();
}

class BlocProvider<T extends BlocBase> extends StatefulWidget {
  final T bloc;
  final Widget child;

  const BlocProvider({
    Key? key,
    required this.bloc,
    required this.child,
  }) : super(key: key);

  static T of<T extends BlocBase>(BuildContext context) {
    // 用官方推荐的方法查找InheritedWidget
    final provider = context.dependOnInheritedWidgetOfExactType<_BlocProviderInherited<T>>();
    if (provider == null) {
      throw Exception("找不到对应类型的BlocProvider，请检查Widget树结构");
    }
    return provider.bloc;
  }

  @override
  _BlocProviderState<T> createState() => _BlocProviderState<T>();
}

class _BlocProviderState<T extends BlocBase> extends State<BlocProvider<T>> {
  @override
  void dispose() {
    // 保留原来的Bloc销毁逻辑
    widget.bloc.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return _BlocProviderInherited<T>(
      bloc: widget.bloc,
      child: widget.child,
    );
  }
}

// 内部用InheritedWidget来传递Bloc实例
class _BlocProviderInherited<T extends BlocBase> extends InheritedWidget {
  final T bloc;

  const _BlocProviderInherited({
    Key? key,
    required this.bloc,
    required Widget child,
  }) : super(key: key, child: child);

  @override
  bool updateShouldNotify(_BlocProviderInherited oldWidget) => bloc != oldWidget.bloc;
}

使用方式不变 #

改完之后，你原来的EventDialog代码不需要任何修改，直接用builder里的newContext就能获取Bloc：

@override
Widget build(BuildContext context) {
  _accountBloc = BlocProvider.of<AccountBloc>(context);
  // ... 剩下的代码正常运行
}

方案对比 #

• 方案一：快速临时解决，适合简单场景，但如果弹窗嵌套深或者需要在多个弹窗里用Bloc，传递上下文会很繁琐；
• 方案二：一次修改长期受益，符合Flutter的设计规范，后续所有弹窗、路由页面都能直接通过上下文获取Bloc，维护性更好。

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