Comments (6)
I've also tried below method but it doesn't work
appRouter.push(HomeRoute(children: [URNVerificationRoute()]));
from auto_route_library.
Have you already fixed it on your end? I might help you as I have successfully implemented the same logic on my app.
from auto_route_library.
You just need to change few parts on your router.dart file this is what my router.dart looks like
@AutoRouterConfig(replaceInRouteName: 'Screen,Route')
class AppRouter extends $AppRouter {
@override
final List<AutoRoute> routes = [
AutoRoute(path: "/", page: StartupView.page),
AutoRoute(path: "/navigation", page: NavigationView.page, children: [
AutoRoute(path: "home", page: HomeView.page),
AutoRoute(
path: "learning-hub-navigaton",
page: LearningNavigationView.page,
children: [
AutoRoute(path: "learning-hub", page: LearningHubView.page, initial: true),
AutoRoute(path: "new-activity", page: NewActivityView.page),
AutoRoute(path: "activity-info", page: ActivityInfoView.page),
],
),
AutoRoute(path: "create-course", page: CreateCourseView.page),
AutoRoute(path: "settings", page: SettingsView.page),
]),
];
}
Remember if you are nesting a navigation inside a nested navigation your inner navigation should have a top view dedicated for handling the inner navigation, on my end this is the LearningNavigationView.page, following is the content of this file:
Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 20, 0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
... // --> this should be your navbar if i'm not mistaken
),
Expanded(child: AutoRouter()) // --> this is important this is where inner navigations will be displayed like some kind of a placeholder --> [ AutoRoute(path: "learning-hub", page: LearningHubView.page, initial: true),
AutoRoute(path: "new-activity", page: NewActivityView.page),
AutoRoute(path: "activity-info", page: ActivityInfoView.page),] these screens are displayed here
],
),
);
Remember to set an initial page for your inner nested navigation
from auto_route_library.
@lukecastronuevo,
How can you use AutoRoute as children of column widget, can you please explain me?
And how can we navigate inner route in web app?
from auto_route_library.
wait so routing for nested in web does not work..?
been trying to use navigate, replace, push - nothing is working
p.s. independent routes work
from auto_route_library.
I have created a sample app with nested navigation.
Check it here:
It's not much, but it might help you with understanding nested navigation in web. Also I can confirm that autoroute works on web.
from auto_route_library.
Related Issues (20)
- Cannot reload route with callback parameter HOT 1
- [BUG] deeplinkBuilder is not called
- Codegen can't find widgets, they need to be imported into the app_router file HOT 1
- Inconsistent ReevaluateListenable Behavior on Web vs. Android
- didPop & didPopNext not called
- IOS swipe back make TextField not focus when tab on TextField when app build with flutter 3.22 HOT 2
- CustomRoute() transition gets overridden by defaultRouteType
- Handling of back navigation in nested routes, ignored PopScope HOT 2
- pushing to same screen issue
- New Xcode error out of the blue HOT 1
- [Bug] - Using the same Screen as Two routes results into an exception
- [QUESTION] Why RouteMatch operator == doesn't have args?
- AutoTabsRouter.pageView sibling views defaults to path '' HOT 2
- Cannot navigate to child route with @PathParam.inherit("param"). HOT 13
- Issues Implementing Custom rebuildAll and popAllAndPushAll Methods in auto_route HOT 3
- deepLinkBuilder && doubling element's tree HOT 1
- Pushing to sub-page in another tab and maintaining history? HOT 5
- deepLinkBuilder Not working on Production HOT 1
- Default function argument value has no import prefix
- Automatically back when use CustomRoute with swipe for back HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from auto_route_library.