I'm building an app with Flutter.
Consider the following routes in the app:
/section-a/a
/section-a/b
/section-a/c
/section-b/a
/section-b/b
/section-b/c
Each section could also have more children with children having children. Typical nested routing.
I'm using go_router (10.0.0) and go_router_builder (2.2.1) to build the basic infrastructure like this:
const $sectionARoutes = [
TypedGoRoute<...>(path: '/section-a/a'),
TypedGoRoute<...>(path: '/section-a/b'),
TypedGoRoute<...>(path: '/section-a/c'),
];
As you can see, I have to duplicate the string section-a
in each route.
Now, my idea was to make a container route with children:
const $sectionARoutes = TypedGoRoute(
path: '/section-a',
routes: [
TypedGoRoute<...>(path: 'a'),
TypedGoRoute<...>(path: 'b'),
TypedGoRoute<...>(path: 'c'),
]
)
Now, I don't need to duplicate that string and visually it looks the same.
However, when I'm, e.g. at location /section-a/a
, I can do a swipe gesture beginning on the left side and swipe to the right ("navigate back" swipe) and then my location is /section-a
showing a white page (SizedBox.shrink()
).
That's because the TypedGoRoute(path: '/section-a')
is also a valid viewable target.
However, that's not what I want. I basically search a way to define a parent that I can not route to. Is that possible?
I tried specifying a redirct
for the parent route, however this only works when routing to that page directly, but is not taken into account when "navigating back" (could also be a bug in the go_router).