Flutter调用showDialog报Navigator上下文错误，尝试子组件/Builder仍未解决

问题根源 #

你调用showDialog时使用的context并未关联到Navigator实例——MaterialApp.router是提供Navigator的顶层组件，而你的BlocListener所在层级的上下文无法访问到这个Navigator。

直接解决方案：使用全局NavigatorKey弹出对话框 #

既然你已经配置了router.routerDelegate.navigatorKey，直接通过这个key获取NavigatorState即可绕过上下文限制，修改后的SubWidget代码如下：

class SubWidget extends StatelessWidget {
  const SubWidget({super.key, this.child});

  final Widget? child;

  @override
  Widget build(BuildContext context) {
    return UpgradeAlert(
      navigatorKey: router.routerDelegate.navigatorKey,
      child: BlocListener<NetworkBloc, NetworkState>(
        listener: (context, state) async {
          if (state is NetworkFailure) {
            // 通过全局navigatorKey获取NavigatorState
            await router.routerDelegate.navigatorKey.currentState!.showDialog(
              context: router.routerDelegate.navigatorKey.currentContext!,
              builder: (context) {
                return const AlertDialog(
                  title: Text('No Network'),
                );
              },
            );
          }
        },
        child: child,
      ),
    );
  }
}

额外优化：避免重复弹窗 #

添加listenWhen条件，防止网络状态频繁切换时重复弹出相同对话框：

BlocListener<NetworkBloc, NetworkState>(
  // 仅当状态从非失败变为失败时触发
  listenWhen: (previous, current) => previous is! NetworkFailure && current is NetworkFailure,
  listener: (context, state) async {
    // 弹窗代码同上
  },
  child: child,
)

为什么之前的Builder无效？ #

你添加的Builder仅在UpgradeAlert子节点增加了上下文层级，但该上下文依然处于MaterialApp.router的builder内部，并未关联到Navigator的上下文。使用全局navigatorKey是MaterialApp.router场景下最可靠的弹窗方式。

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