NavigationEasy20 XP3 min read
What are the different ways to pass data between routes in Flutter?
TL;DR: Data can be passed via constructor arguments (Navigator 1.0), route path/query parameters, route arguments (ModalRoute.of), go_router's extra or pathParameters, or via shared state management.
Full Answer
- ▸Constructor injection (Navigator 1.0): MaterialPageRoute(builder: (_) => DetailPage(item: item))
- ▸RouteSettings.arguments: Navigator.pushNamed(context, '/detail', arguments: item)
- ▸go_router path params: /product/:id → state.pathParameters['id']
- ▸go_router query params: /search?q=flutter → state.uri.queryParameters['q']
- ▸go_router extra: context.go('/detail', extra: item) — not URL-safe
- ▸Shared state (Riverpod/BLoC): pre-load data in state before navigating
🎯
Prefer path/query params for data that should be deep-linkable. Use extra for complex in-memory objects. Use shared state for data that multiple screens need.
Code Examples
dartgo_router data passing
Output
Path param: URL is /product/42 — shareable and deep-linkable. Extra: URL is /product/42 but full Product object is passed in memory.
Common Mistakes
- ✗Using extra for data you want to deep-link — extra is lost on cold start
- ✗Casting state.extra without null checking — throws on direct URL navigation
Interview Tip
💡
Explain the deep-linking implication: path/query params survive a cold-start URL open; extra does not. This shows you think beyond happy-path scenarios.
#navigation#data-passing#arguments#path-parameters#extra