Flutter中MaterialPageRoute无法正常打开新页面问题求助

云原生阿岚

2026-8-11

问题分析与解决

1. PopupMenuItem的onTap无法跳转页面的原因

showMenu 弹出的菜单在点击PopupMenuItem时，会优先触发菜单关闭逻辑，此时直接调用Navigator.push会因弹窗上下文的状态变化，导致导航操作被中断——这就是为什么print能正常执行，但页面跳转没反应的原因。

解决办法

把导航操作延迟到弹窗关闭后执行，用WidgetsBinding.instance.addPostFrameCallback等待当前帧结束（弹窗关闭）后再触发导航：

PopupMenuItem(
  onTap: () {
    print(movie.title);
    WidgetsBinding.instance.addPostFrameCallback((_) {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => MoreInfo(movie: movie)),
      );
    });
  },
  child: Text("More info"),
),

2. InkWell包裹后页面仅显示背景的原因

嵌套在PopupMenuItem里的InkWell，点击时使用的是弹窗内部的上下文，这个上下文不属于当前页面的导航栈，导致新页面的Scaffold无法正确渲染AppBar。

解决办法

使用rootNavigator: true获取根导航器的上下文，确保导航操作在正确的栈中执行：

InkWell(
  onTap: () {
    Navigator.push(
      Navigator.of(context, rootNavigator: true),
      MaterialPageRoute(builder: (context) => MoreInfo(movie: movie)),
    );
  },
  child: Text("More info"),
),

另外检查MoreInfo页面的Scaffold结构，确保补充body部分（如果需要），不过核心问题还是导航上下文的错误。