如何用 Navigator 2.0 替换动画页面？

Question

我正在通过更改 pages 集合中的项目导航到另一个页面。

final page = ...
return Scaffold(
            body: Navigator(
              onPopPage: (Route<dynamic> route, dynamic result) {
                return route.didPop(result);
              },
              pages: [
                MaterialPage(child: page),
              ],
            ),
...

并且在这种情况下没有过渡动画（至少在 IOS 上）。当我向集合中添加页面时 - 动画出现。但我不需要页面堆栈。如何解决？

Answer 1

更改页面时更改key参数。

例子：

final page = condition 
  ? MaterialPage(key: ValueKey('page1'), child: page1)
  : MaterialPage(key: ValueKey('page2'), child: page2);

return Scaffold(
            body: Navigator(
              onPopPage: (Route<dynamic> route, dynamic result) {
                return route.didPop(result);
              },
              pages: [
                page,
              ],
            ),