Build Status
Build Status

功能

根据当前Router位置，声明式地切换子组件。

class SideBar extends StatelessWidget {
    Widget build(_){
     return RoutedWidgetSwitcher(
        builders: [
            PathBuilder('/', builder: (_) => const MainMenu()),
            PathBuilder('/dashboard', builder: (_) => const DashboardMenu()),
            PathBuilder('/settings', builder: (_) => const SettingsMenu()),
        ]);
    }
}

作为任何Router（又名Nav2）实现的补充包。包括流行的路由解决方案，如 GoRouter、 RouteMaster 或 VRouter。

这在2个主要用例中有用

  • 当你的导航器周围有脚手架时，例如SideBar或TitleBar，你想让它对位置变化做出反应。
  • 当多个路径解析到同一个Page时，你想将后续路由移到树的更深处。

注意：此包不提供任何路由器位置的控制，它只是读取当前位置并做出相应的响应。

? 安装

dependencies:
  routed_widget_switcher: ^1.0.0

?️ 用法

将小部件放置在根Router小部件的任何下方，并定义你想匹配的路径。默认情况下，路径被认为是大小写不敏感的，并被视为前缀，但可以禁用此功能。

return RoutedWidgetSwitcher(
  caseSensitive: true,
  builders: [
    // require an exact match if prefix=false
    PathBuilder('/', prefix: false, builder: (_) => const MainMenu()),
     // allow anything prefixed with `/dashboard`
    PathBuilder('/dashboard', builder: (_) => const DashboardMenu()),
  ],
);

路径匹配

路径可以定义为简单的字符串，如/user/new或user/:userId，或者使用正则表达式语法，如r'/user/:id(\d+)'。有关高级用例的更多详细信息，请参阅pathToRegExp库： https://pub.dev/packages/path_to_regexp。

除了pathToRegExp进行的匹配之外，还可以使用通配符*字符来匹配任何位置。

最具体的匹配

RoutedWidgetSwitcher将尝试使用最具体的匹配。例如，/users/new的位置会匹配以下所有构建器：

PathBuilder('/users/:userId', builder: (_) => const TeamDetails()),
PathBuilder('/users/new', builder: (_) => const NewTeamForm()),
PathBuilder('*', builder: (_) => const PathNotFound()),

由于/users/new是更精确的匹配，所以它将是渲染的那个，声明它们的顺序无关紧要。/users/:userId将紧随其后，最后由通配符*匹配。

获取当前位置

此包包含一个RouterUtils.getLocation(context)方法，如果您想读取当前路由器位置，该方法将返回该位置。

过渡

内部使用Flutter的AnimatedSwitcher小部件进行过渡，因此暴露了完整的API以实现不同的过渡效果。

return RoutedWidgetSwitcher(
  transitionBuilder: ...
  duration: ...,
  builders: [],
)

? Bug/需求

如果您遇到任何问题，请打开一个 issue。如果您觉得库缺少某个功能，请在 Github 上提交一个 ticket，我们将进行审查。欢迎提交 Pull Request。

? 许可证

MIT 许可

GitHub

查看 Github