URL parameters
- Flutter course
- Intermediate
- Lesson 69/99
- 4 min
Read path parameters and query strings.
Path parameters
In a GoRoute path, names starting with a colon like :id define a path parameter. You access its value through the pathParameters property of the state object passed to the builder.
GoRoute(
path: '/kullanici/:id',
builder: (context, state) {
final id = state.pathParameters['id']!;
return KullaniciScreen(id: id);
},
)Query parameters
You access query strings in the form ?key=value in a URL through state.queryParameters. For example, in the path /ara?kelime=elma, state.queryParameters['kelime'] returns 'elma'.
GoRoute(
path: '/ara',
builder: (context, state) {
final kelime = state.queryParameters['kelime'] ?? '';
return AraScreen(kelime: kelime);
},
)Practice Screen with a path parameter
Define a GoRoute with the path /kullanici/:id. In the builder, read state.pathParameters['id'] and return KullaniciScreen(id: id). Print 'hazir' in main.
Starter code
import 'package:flutter/widgets.dart';
import 'package:go_router/go_router.dart';
class KullaniciScreen extends StatelessWidget {
final String id;
const KullaniciScreen({super.key, required this.id});
@override
Widget build(BuildContext context) => const SizedBox.shrink();
}
// /kullanici/:id path'ine sahip GoRoute tanımla
// builder içinde yol parametresini oku
// KullaniciScreen'e id parametresi olarak ver
void main() {
// 'hazir' yazdır
}Sample solution
import 'package:flutter/widgets.dart';
import 'package:go_router/go_router.dart';
class KullaniciScreen extends StatelessWidget {
final String id;
const KullaniciScreen({super.key, required this.id});
@override
Widget build(BuildContext context) => const SizedBox.shrink();
}
final route = GoRoute(
path: '/kullanici/:id',
builder: (context, state) {
final id = state.pathParameters['id']!;
return KullaniciScreen(id: id);
},
);
void main() {
print('hazir');
}Expected output
hazir
Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 What does ':id' in a GoRoute path specify?
- A constant value
- A widget name
- A query parameter
- A path parameter Correct answer
Explanation: Names starting with a colon are path parameters; the value at that position in the URL is read via state.pathParameters. It is not a constant, not a widget name, and a query parameter starts with '?'.
2 Read the path parameter
GoRoute(
path: '/kullanici/:id',
builder: (context, state) {
final id = state.____!;
return KullaniciScreen(id: id);
},
)GoRoute(
path: '/kullanici/:id',
builder: (context, state) {
final id = state.pathParameters['id']!;
return KullaniciScreen(id: id);
},
)Explanation: Path parameters are read via state.pathParameters. queryParameters is for '?' values, and params and route are not properties of GoRouterState.
3 Parameter parts
| Term | Meaning |
|---|---|
:id |
Path parameter definition |
state.pathParameters |
Path parameters |
state.queryParameters |
Query parameters |
?kelime=elma |
Query string |