[ go_router ] can't push page on the shell without key even though the page is outside shellroute #113001
Comments
DattatreyaReddy
changed the title
|
@DattatreyaReddy Thanks for the report. From the given code sample, I see that you are using |
darshankawar
added
the
waiting for customer response
|
Hi @darshankawar, Answering your question, Yes, the behavior is the same without Here is the updated code sample.import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
void main() => runApp(MyApp());
final GlobalKey<NavigatorState> _rootNavigatorKey =
GlobalKey<NavigatorState>(debugLabel: 'root');
final GlobalKey<NavigatorState> _shellNavigatorKey =
GlobalKey<NavigatorState>(debugLabel: 'shell');
class ShellWidget extends StatefulWidget {
const ShellWidget({
super.key,
required this.child,
});
final Widget child;
@override
State<ShellWidget> createState() => _ShellWidgetState();
}
class _ShellWidgetState extends State<ShellWidget> {
int index = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text("Hello")),
bottomNavigationBar: BottomNavigationBar(
currentIndex: index,
onTap: (value) {
setState(() {
index = value;
switch (value) {
case 0:
context.go('/a');
break;
case 1:
context.go('/c');
break;
default:
}
});
},
items: const [
BottomNavigationBarItem(
icon: Icon(
Icons.access_alarm,
),
label: 'a',
),
BottomNavigationBarItem(
icon: Icon(
Icons.access_alarm,
),
label: 'c',
),
],
),
body: widget.child,
);
}
}
class MyApp extends StatelessWidget {
MyApp({super.key});
final routes = GoRouter(
debugLogDiagnostics: true,
initialLocation: '/a',
navigatorKey: _rootNavigatorKey,
routes: [
ShellRoute(
navigatorKey: _shellNavigatorKey,
builder: (context, state, child) => ShellWidget(child: child),
routes: [
GoRoute(
path: '/a',
builder: (context, state) => const DummyScreen(
color: Colors.green,
text: '/b',
),
),
GoRoute(
path: '/c',
builder: (context, state) => const DummyScreen(
color: Colors.green,
text: '/d',
),
),
],
),
GoRoute(
path: '/d',
parentNavigatorKey: _rootNavigatorKey,
builder: (context, state) => const DummyScreen(
color: Colors.red,
text: '/d/e',
),
routes: [
GoRoute(
// can't push this page at all
path: 'e',
builder: (context, state) => const DummyScreen(
color: Colors.red,
text: '/c',
),
),
],
),
GoRoute(
// can't push this page on the shell without key
// even though it is outside of shell route
path: '/b',
builder: (context, state) => const DummyScreen(
color: Colors.green,
text: '',
),
),
],
);
@override
Widget build(BuildContext context) {
return MaterialApp.router(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
routeInformationParser: routes.routeInformationParser,
routeInformationProvider: routes.routeInformationProvider,
routerDelegate: routes.routerDelegate,
);
}
}
class DummyScreen extends StatelessWidget {
const DummyScreen({
super.key,
required this.color,
required this.text,
});
final Color color;
final String text;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(GoRouter.of(context).location)),
backgroundColor: color,
body: Center(
child: ElevatedButton(
onPressed: text.isNotEmpty ? () => context.push(text) : null,
child: Text(text),
),
),
);
}
}
|
github-actions
bot
removed
the
waiting for customer response
|
Thanks for the updated code sample. Using it, I am seeing same behavior as reported. stable, master flutter doctor -v |
darshankawar
added
p: first party
package
|
|
|
There is two problem with your code:
|
In the example route Also, the problem is that I need to add
That is required to use subroutes in gorouter, https://github.com/flutter/packages/blob/main/packages/go_router/doc/configuration.md#child-routes Child routesA matched route can result in more than one screen being displayed on a To display a screen on top of another, add a child route by adding it to the GoRoute(
path: '/',
builder: (context, state) {
return HomeScreen();
},
routes: [
GoRoute(
path: 'details',
builder: (context, state) {
return DetailsScreen();
},
),
],
) |
|
any updates on this, cause I am facing the same problem I can't go to the sub router (/referral/all) when I am outside of the shell route after giving (/referral)'s parentNavigatorKey the _rootNavigatorKey to be able to ignore shell router. and it actually changes the current location from /referral to /referral/all but the screen actually still on /referral. |
flutter-triage-bot
bot
added
multiteam-retriage-candidate
team-go_router
Why must we do this? Shouldn't the parent be implicit? I don't understand this aspect of |
|
After absorbed the above answers, I wrote an example(pseudo code), I used go_router: ^12.0.0 You need to create key for each root or shell page, make sure to use the correct key The structure is Also, if someone is facing the route path won't change on web when navigate to sub route which belongs to different root route. In the example, assume that I have a bottom Navigation Bar (Tabs :Home, Page One) , a button for navigating to account inside Page One and a back button from app bar inside account page. |
This pr refactor RouteMatchList to be a tree structure. Added a common base class RouteMatchBase. It is extended by both RouteMatch and ShellRouteMatch. The RouteMatch is for GoRoute, and is always a leaf node The ShellRouteMatch is for ShellRouteBase, and is always and intermediate node with a list of child RouteMatchBase[s]. This pr also redo how push is processed. Will add a doc explain this shortly. This is a breaking change, will write a migration guide soon. fixes flutter/flutter#134524 fixes flutter/flutter#130406 fixes flutter/flutter#126365 fixes flutter/flutter#125752 fixes flutter/flutter#120791 fixes flutter/flutter#120665 fixes flutter/flutter#113001 fixes flutter/flutter#110512
darshankawar
added
the
r: fixed
|
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of |
Steps to Reproduce
flutter runon the code sampleExpected results:
ithe page should be on top of the shell routevwe should be able to go to/d/eActual results:
ithe page is inside the shellvwe can't go to/d/eCode sample
Logs
video
Screen.Recording.2022-10-06.at.10.12.18.AM.mov
The text was updated successfully, but these errors were encountered: