Flutter对话框触发父组件Navigator路由重复创建页面问题

这个问题我之前也碰到过，本质是Flutter路由的builder函数在特定场景下会被重复调用导致的，具体原因和解决办法如下：

为什么会重复创建SecondScreen？ #

当你调用showDialog弹出对话框（或者操作对话框内的输入框）时，Flutter会在当前路由的Overlay层添加/修改组件，这会触发路由的依赖变更，进而导致MaterialPageRoute的builder函数被重新执行——而你当前的写法是每次builder调用都新建一个SecondScreen实例，自然就出现了重复创建的问题。

解决方法（按推荐程度排序） #

1. 提前创建SecondScreen实例 #

最直接的办法是在调用Navigator.push之前就创建好SecondScreen的实例，然后在builder中直接返回它，这样即使builder被重复调用，也不会新建实例：

// 提前创建实例
final secondScreen = SecondScreen("myData");
Navigator.push(context, MaterialPageRoute(
  builder: (context) {
    return secondScreen;
  }
));

2. 使用PageRouteBuilder显式控制路由行为 #

如果你需要更精细的路由控制，可以用PageRouteBuilder替代MaterialPageRoute，显式指定maintainState: true（虽然默认是true，但显式设置能避免意外），同时保持默认的页面过渡效果：

Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => SecondScreen("myData"),
    maintainState: true,
    // 保持和MaterialPageRoute一致的淡入过渡
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      return FadeTransition(opacity: animation, child: child);
    },
  ),
);

3. 将SecondScreen改为StatefulWidget（状态保护） #

如果你的SecondScreen是StatelessWidget，建议改成StatefulWidget，把需要保留的状态放到State类中。这样即使SecondScreen被重新创建，State实例会被Flutter保留，不会丢失业务数据和状态。

4. 检查对话框逻辑是否触发父级状态变更 #

另外要排查下showEditAmountDialog内部的逻辑，有没有触发首页（或者SecondScreen的父级）的状态更新——如果父级状态变化，也可能导致路由的builder被重新调用。

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