Flutter-web Autoroute，尝试直接访问嵌套路由的问题

Question

我有一个有 2 个屏幕的应用：

• 商家列表：屏幕显示商家列表
• 单一商户：带有标签的屏幕，每个标签都应该显示一些小部件并且应该有自己的路线

路由配置如下：

AutoRoute(
  path: '/merchants',
  name: 'MerchantsRoute',
  page: EmptyRouterPage,
  guards: [AuthGuard],
  children: [
    AutoRoute(path: '', page: MerchantsView, guards: [AuthGuard], initial: true),
    AutoRoute(
      path: ':id',
      page: SingleMerchantView,
      guards: [AuthGuard],
      children: [
        AutoRoute(path: 'dashboard', page: Dashboard, guards: [AuthGuard], name: 'MerchantDashboardRoute'),
        AutoRoute(path: 'purchases', page: PurchasesList, guards: [AuthGuard], name: 'MerchantPurchasesRoute'),
        AutoRoute(path: 'profile', page: PurchasesList, guards: [AuthGuard], name: 'MerchantProfileRoute'),
      ]
    ),

  ]
),

SinglMerchantView 是包含 AutoTabsScaffold 和 TabBarView

的小部件

使用 flutter web，当我直接访问（通过直接在 chrome 中输入 url）到：

• /merchants ==> 有效
• /merchants/some_merchant_id ==> 可以正常工作，正确显示 SingleMerchantView 并选择了第一个选项卡并构建了 Dashboard
• /merchants/some_merchant_id/dashboard ==> 它不像预期的那样工作。我期望首先创建 SingleMerchantView，然后它应该创建 Dashboard 小部件 我看到的是它试图直接创建小部件 Dashboard 而不创建小部件 SingleMerchantView。由于仪表板小部件需要一个强制性的 id 属性（通常由父 SingleMerchantView 注入），因此页面失败

知道如何解决这个问题吗？

Answer 1

我的理解是你需要一个 EmptyRouterPage 为每个鸟巢。类似的东西：

AutoRoute(
  path: '/merchants',
  name: 'MerchantsRoute',
  page: EmptyRouterPage,
  guards: [AuthGuard],
  children: [
    AutoRoute(path: '', page: MerchantsView, guards: [AuthGuard], initial: true),
    AutoRoute(
      name: 'SingleMerchantRouter',
      path: ':id',
      page: EmptyRouterPage,
      guards: [AuthGuard],
      children: [
        AutoRoute(path: '', page: SingleMerchantView, guards: [AuthGuard]),
        AutoRoute(path: 'dashboard', page: Dashboard, guards: [AuthGuard], name: 'MerchantDashboardRoute'),
        AutoRoute(path: 'purchases', page: PurchasesList, guards: [AuthGuard], name: 'MerchantPurchasesRoute'),
        AutoRoute(path: 'profile', page: PurchasesList, guards: [AuthGuard], name: 'MerchantProfileRoute'),
      ]
    ),

  ]
),

我无法测试，但它与我今天遇到的问题相似。