Flutter弹窗按钮导航失效且弹窗无法关闭求助

嘿，我来帮你搞定这个问题！你遇到的弹窗关不掉、导航也没反应，核心原因是你没先关闭弹窗就直接跳转页面，再加上弹窗的context层级可能干扰了导航操作。

问题分析 #

你当前的代码里，点击按钮直接调用Navigator.pushReplacement，但Alert弹窗本身属于路由栈里的一个临时路由，你没先把它从栈里移除就跳转，导致弹窗残留，同时弹窗的context可能让导航操作没作用在正确的导航器上。另外注意下，Flutter里Widget类名要大写，你代码里的support()应该是Support()哦。

修复方案 #

只需要两步：先关闭弹窗，再执行页面导航。这里给你修改好的代码：

Alert(
  context: context,
  title: "Thank You!",
  desc: "Your inquiry has been sent",
  image: Image.asset("assets/success.png"),
  buttons: [
    DialogButton(
      child: Text(
        "Okay",
        style: TextStyle(color: Colors.white, fontSize: 20),
      ),
      onPressed: () {
        // 1. 先关闭当前弹窗
        Navigator.pop(context);
        // 2. 再跳转到目标页面
        Navigator.pushReplacement(
          context,
          MaterialPageRoute(builder: (BuildContext context) => Support()),
        );
      },
      width: 120,
    )
  ],
).show();

额外提示 #

如果还是遇到导航问题，可以试试用根导航器来处理跳转，彻底避免弹窗context的干扰：

onPressed: () {
  Navigator.pop(context); // 先关弹窗
  Navigator.of(context, rootNavigator: true).pushReplacement(
    MaterialPageRoute(builder: (context) => Support()),
  );
}

这样修改后，点击"Okay"按钮时，弹窗会先关闭，然后正常跳转到Support页面啦！

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