Flutter Web使用Fluro路由时如何传递不在URL中显示的参数

Fluro 原生支持通过路由配置传递不拼接至URL的隐藏参数，无需依赖额外第三方库，具体修改步骤如下：

1. 扩展路由跳转方法，增加隐藏参数传参入口 #

修改FluroRouting类中的navigateToPage静态方法，新增可选的arguments参数，通过RouteSettings传递给路由，不会拼接到URL地址栏：

static void navigateToPage({
  required String routeName,
  required BuildContext context,
  dynamic arguments, // 隐藏参数容器，支持任意类型
}) {
  router.navigateTo(
    context,
    routeName,
    transition: TransitionType.none,
    // 隐藏参数将存入路由配置，不会出现在URL中
    routeSettings: RouteSettings(arguments: arguments),
  );
}

2. 路由Handler中读取隐藏参数 #

通过ModalRoute从上下文读取路由配置中的隐藏参数，完成页面参数赋值：

static Handler _passHandler = Handler(
  handlerFunc: (BuildContext? context, Map<String, dynamic> params) {
    // 读取隐藏参数，可根据实际传参类型强转，也可加判空逻辑避免异常
    final argument2 = ModalRoute.of(context!)?.settings.arguments as int? ?? 0;
    return Pass(
      Argument1: params['arg'][0],
      Argument2: argument2,
    );
  }
);

3. 调用跳转时传参 #

需要跳转页面时，将不需要显示在URL的参数传入arguments字段即可：

// 此时URL仅显示/pass/abc，178不会出现在地址栏
FluroRouting.navigateToPage(
  routeName: '/pass/abc',
  context: context,
  arguments: 178,
);

多隐藏参数传参方案 #

如果需要传递多个非URL可见参数，直接传入Map或自定义实体类即可：

// 传参
arguments: {'userId':178, 'userName':'测试用户', 'isVip':true}
// 读取
final args = ModalRoute.of(context!)?.settings.arguments as Map;
int userId = args['userId'];
String userName = args['userName'];

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