'Flutter AutoRoute open child page from nested page

I need to implement the following routing: home_page -> nested_page -> child_page.

But I am getting an error:

Looks like you're trying to navigate to a nested route without adding their parent to stack first

try navigating to NestedRoute -> ChildRouter

my routers:

@MaterialAutoRouter(
  replaceInRouteName: 'Page,Route',
  routes: <AutoRoute>[
    AutoRoute(
      path: '/home_page',
      page: HomePage,
      children: [
        AutoRoute(path: 'search', page: SearchPage),
        AutoRoute(
          path: 'nested_page',
          name: 'NestedRouter',
          page: EmptyRouterPage,
          children: [
            AutoRoute(
              path: '',
              page: NestedPage,
              children: [
                AutoRoute(
                  path: 'child_page',
                  name: 'ChildRouter',
                  page: EmptyRouterPage,
                  children: [
                    AutoRoute(path: '', page: childPage)
                  ]
                ),
              ]
            )
          ]
        ),
        AutoRoute(path: 'otherPage1', page: OtherPage1),
        AutoRoute(path: 'otherPage2', page: OtherPage2)
      ]
    ),
  ]
)

HomePage:

AutoTabsScaffold(
    appBarBuilder: (context, tabsRouter) => AppBarWidget(),
    bottomNavigationBuilder: (context, tabsRouter) => BottomNavigationBar(
      items: const [
        ...
      ],
      currentIndex: tabsRouter.activeIndex,
      onTap: tabsRouter.setActiveIndex,
    ),
    routes: [
      NestedRouter(
        children: [NestedRoute()]
      ),
      const OtherPage1(),
      const OtherPage2()
    ]
)

NestedPage:

GestureDetector(
  onTap: () {
    context.router.push( //Error occurs here
      ChildRouter(
        children: [
          ChildRoute(
            data: data,
            data2: data2
          )
        ]
      )
    );
  },
  child: Container(
    ...
  )
)

Thanks in advance!



Solution 1:[1]

Made ChildPage a child of NestedRouter, now the page can be opened via:

push(
  ChildRoute(
    entity1: entity1,
    entity2: entity2
  )
)

But I'm not sure if it's right. Final router file:

@MaterialAutoRouter(
  replaceInRouteName: 'Page,Route',
  routes: <AutoRoute>[
    AutoRoute(
      path: '/home_page',
      page: HomePage,
      children: [
        AutoRoute(path: 'search', page: SearchPage),
        AutoRoute(
          path: 'nested_page',
          name: 'NestedRouter',
          page: EmptyRouterPage,
          children: [
            AutoRoute(
              path: '',
              page: NestedPage
            ),
            AutoRoute(path: 'child', page: ChildPage)
          ]
        ),
        AutoRoute(path: 'otherPage1', page: OtherPage1),
        AutoRoute(path: 'otherPage2', page: OtherPage2)
      ]
    ),
  ]
)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Vobla in a basin