fluro

英文原文正文为项目原始 README（英文），本站后续会翻译为中文，当前仅剔除图片与无关章节并统一排版。

英语 | 葡萄牙语

针对 Flutter 的最明亮、最时尚、最酷的路由器。

功能

• 简单的路由导航
• 功能处理器（映射到函数而不是路由）
• 通配符参数匹配
• 查询字符串参数解析
• 内置常用过渡效果
• 简单的自定义过渡创建
• 遵循 stable Flutter 频道
• 空安全

示例项目

example 文件夹里有一个非常不错的示例项目。去看看吧。否则，请继续阅读以快速上手。

入门指南

首先，你应该通过如下方式初始化来定义一个新的 FluroRouter 对象：

final router = FluroRouter();

将路由器全局/静态存储可能会很方便，这样您就可以在应用程序的其他区域访问路由器。

实例化路由器后，您需要定义路由和路由处理程序：

var usersHandler = Handler(handlerFunc: (BuildContext context, Map<String, dynamic> params) {
  return UsersScreen(params["id"][0]);
});

void defineRoutes(FluroRouter router) {
  router.define("/users/:id", handler: usersHandler);

  // it is also possible to define the route transition to use
  // router.define("users/:id", handler: usersHandler, transitionType: TransitionType.inFromLeft);
}

在上面的例子中，路由器将拦截像 /users/1234 这样的路由，并将应用程序路由到 UsersScreen，将值 1234 作为参数传递给该屏幕。

导航

你可以通过 FluroRouter.generator 使用 FluroRouter 配合 MaterialApp.onGenerateRoute 参数。为此，将函数引用传递给 onGenerate 参数，如：onGenerateRoute: router.generator。

然后你可以使用 Navigator.push，Flutter 的路由机制会为你匹配路由。

你也可以手动推送到某个路由。为此：

router.navigateTo(context, "/users/1234", transition: TransitionType.fadeIn);

类参数

不想为参数使用字符串？别担心。

在使用自定义 RouteSettings 推送路由后，你可以使用 BuildContext.settings 扩展来提取设置。通常，这会在 Handler.handlerFunc 中完成，这样你就可以将 RouteSettings.arguments 传递给你的屏幕组件。

/// Push a route with custom RouteSettings if you don't want to use path params
FluroRouter.appRouter.navigateTo(
  context,
  'home',
  routeSettings: RouteSettings(
    arguments: MyArgumentsDataClass('foo!'),
  ),
);

/// Extract the arguments using [BuildContext.settings.arguments] or [BuildContext.arguments] for short
var homeHandler = Handler(
  handlerFunc: (context, params) {
    final args = context.settings.arguments as MyArgumentsDataClass;

    return HomeComponent(args);
  },
);