Flutter页面传参提示找不到detail路由生成器，已配置路由仍报错如何解决

1 优先修复路由名拼写与硬编码问题 #

你代码中首先存在路由名拼写错误+硬编码不一致的隐患：
目标页面SubCommoditiePage中定义的静态路由名变量拼写错误（多了1个字母n）：

// 错误写法
static const String routenName = 'detail';
// 修正写法
static const String routeName = 'detail';

修正后所有用到detail路由名的位置统一调用该静态变量，避免手写字符串出错：

• 主应用路由表配置：

routes: {
  WelcomePage.routeName: (_) => const WelcomePage(),
  SubCommoditiePage.routeName: (_) => const SubCommoditiePage(),
},

• 跳转逻辑：

Navigator.pushNamed(context, SubCommoditiePage.routeName, arguments: _optionsToDisplay[index]);

2 路由注册方式冲突修复 #

你同时给SubCommoditiePage定义了静态route()方法，又在routes表中注册路由，两种注册方式不要混用，推荐二选一：

方案A：继续使用静态路由表 #

删除SubCommoditiePage中没用的静态route()方法即可，保持当前路由表配置即可正常工作。

方案B：使用onGenerateRoute注册（更适合传参场景） #

把detail路由从静态routes表中移除，在MaterialApp中新增onGenerateRoute配置，确保参数能正常传递：

@override
Widget build(BuildContext context) {
  return MaterialApp(
    debugShowCheckedModeBanner: false,
    initialRoute: WelcomePage.routeName,
    routes: {
      WelcomePage.routeName: (_) => const WelcomePage(),
    },
    onGenerateRoute: (settings) {
      if (settings.name == SubCommoditiePage.routeName) {
        return MaterialPageRoute(
          builder: (_) => const SubCommoditiePage(),
          settings: settings, // 必须传入settings，否则目标页面拿不到参数
        );
      }
      return null;
    },
  );
}

3 异常处理优化 #

目标页面取参数时增加空判断，避免强转崩溃：

@override
Widget build(BuildContext context) {
  final Commodity? commoditySeleted = ModalRoute.of(context)?.settings.arguments as Commodity?;
  // 参数为空时的异常处理
  if (commoditySeleted == null) {
    Navigator.pop(context);
    return const Scaffold(body: Center(child: Text('参数异常')));
  }
  return Scaffold(
    appBar: AppBar(
      title: Text(commoditySeleted.label),
    ),
  );
}

4 兜底排查 #

如果上述修改完成后仍报错，执行flutter clean清理项目缓存后重新编译运行，避免热重载导致的路由缓存问题。

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