iOS下Flutter弹窗调用Navigator.pop未关弹窗反而关闭父组件

在Flutter中调用showDialog弹出自定义Dialog后，点击按钮通过Navigator.of(context).pop()尝试关闭弹窗时，iOS端偶尔会出现弹窗未关闭、反而关闭父组件的异常情况。

原问题代码 #

父组件调用代码：

showDialog<bool>(
          context: context,
          builder: (ct) => MyDialog(
              )).then((v) {
                  if (v ?? false) {
                      myFunc();
                  }
               });

MyDialog的关闭方法：

void close() {
   Navigator.of(context).pop(false);
}

已尝试的方案：添加rootNavigator: true、传递showDialog builder参数的context，但问题仍偶尔出现。

彻底解决方法 #

1. 确保使用Dialog内部的BuildContext

自定义Dialog时，直接使用其build方法中的context执行pop操作，避免传递外部context导致导航栈混淆。示例：

class MyDialog extends StatelessWidget {
  const MyDialog({super.key});

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: const Text("自定义弹窗"),
      actions: [
        TextButton(
          onPressed: () {
            // 使用Dialog自身的context执行pop
            Navigator.of(context).pop(false);
          },
          child: const Text("关闭"),
        ),
      ],
    );
  }
}

2. 用popUntil精准定位关闭Dialog

如果导航栈存在嵌套情况，可通过popUntil结合ModalRoute判断，仅关闭Dialog类型的路由：

void close(BuildContext context) {
  Navigator.popUntil(context, (route) => route is! DialogRoute);
}

3. 明确指定根导航器

如果页面存在多层嵌套Navigator，在调用showDialog时强制使用根导航器，同时关闭时也使用根导航器的context：

// 父组件调用showDialog
showDialog<bool>(
  context: context,
  rootNavigator: true,
  builder: (ct) => const MyDialog(),
).then((v) {
  if (v ?? false) {
    myFunc();
  }
});

// MyDialog中关闭
void close(BuildContext context) {
  Navigator.of(context, rootNavigator: true).pop(false);
}

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