如何在Flutter中使用命名路由返回指定页面？

针对你从订单页直接返回首页、跳过购物车页的需求，有几种实用的实现方式，具体如下：

方法一：使用Navigator.popUntil()保留原页面状态 #

这个方法会逐次弹出路由栈的页面，直到匹配到目标路由（首页），能保留首页之前的状态。

在订单页的返回按钮点击事件中添加代码：

ElevatedButton(
  onPressed: () {
    // 一直弹出页面，直到找到路由名为/home的页面
    Navigator.popUntil(context, ModalRoute.withName('/home'));
  },
  child: const Text('返回首页'),
)

如果首页是路由栈的根页面，还可以用更通用的写法，无需指定路由名：

ElevatedButton(
  onPressed: () {
    // 直接返回路由栈的第一个页面（根页面）
    Navigator.popUntil(context, (route) => route.isFirst);
  },
  child: const Text('返回首页'),
)

方法二：使用Navigator.pushNamedAndRemoveUntil()重置路由栈 #

如果你需要重新初始化首页（比如清空之前的状态），可以用这个方法：跳转到首页的同时，移除路由栈中所有之前的页面，最终栈里只有首页。

代码示例：

ElevatedButton(
  onPressed: () {
    Navigator.pushNamedAndRemoveUntil(
      context,
      '/home',
      (route) => false, // 条件为false表示移除所有之前的路由
    );
  },
  child: const Text('返回首页（重置状态）'),
)

前提：确保路由已正确注册 #

不管用哪种方法，都要先在MaterialApp中完成命名路由的注册，示例如下：

MaterialApp(
  initialRoute: '/home', // 默认启动页
  routes: {
    '/home': (context) => const HomePage(),
    '/cart': (context) => const CartPage(),
    '/orders': (context) => const OrdersPage(),
  },
)

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