非命名路由场景下，错误页面如何获取之前导航的目标路由？

因为你用的是非命名路由，核心思路就是在跳转到错误页时，直接把原目标的Widget实例传递过去，这样错误页就能拿到原导航目标，实现重试跳转。

具体实现步骤 #

1. 定义带参数的错误页 #

错误页需要接收原目标Widget作为参数，方便后续复用：

class ErrorPage extends StatelessWidget {
  // 保存原导航目标的Widget实例
  final Widget targetRouteWidget;

  const ErrorPage({
    super.key,
    required this.targetRouteWidget,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text("导航出错，请检查网络后重试"),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: () {
                // 重试跳转至原目标路由
                Navigator.pushReplacement(
                  context,
                  MaterialPageRoute(builder: (context) => targetRouteWidget),
                );
              },
              child: const Text("重新跳转"),
            ),
          ],
        ),
      ),
    );
  }
}

2. 封装导航方法统一处理错误 #

在原导航的地方捕获错误，跳转到错误页时传入原目标Widget：

// 封装带错误处理的导航方法
Future<void> pushWithErrorHandler(BuildContext context, Widget targetWidget) async {
  try {
    await Navigator.push(
      context,
      MaterialPageRoute(builder: (context) => targetWidget),
    );
  } catch (e) {
    // 假设这里捕获到无网络等错误，跳转至错误页
    Navigator.pushReplacement(
      context,
      MaterialPageRoute(builder: (context) => ErrorPage(targetRouteWidget: targetWidget)),
    );
  }
}

3. 调用封装后的导航方法 #

平时导航时，用这个封装方法代替原生的Navigator.push：

// 比如原目标是DetailPage，传入配置好参数的实例
pushWithErrorHandler(context, const DetailPage(id: 123));

关键点说明 #

• 非命名路由的核心是基于Widget实例导航，所以只要保存好原目标的Widget实例（包括它的参数配置），就能在错误页中直接复用。
• 如果原目标Widget有动态参数，只要确保传递给错误页的是已经初始化好参数的实例即可，无需额外处理路由信息。

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