flutter_router_query_params.dart

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

class Account {
  const Account({required this.id, required this.transactions});

  final String id;

  final List<Transaction> transactions;
}

class Transaction {
  const Transaction({required this.id, required this.amount});

  final String id;

  final int amount;
}

List<Account> _accounts = List<Account>.of([
  Account(
    id: 'Personal_Account',
    transactions: List<Transaction>.of([
      const Transaction(id: '1', amount: 1000),
      const Transaction(id: '2', amount: 2000)
    ]),
  ),
  Account(
    id: 'Business_Account',
    transactions: List<Transaction>.of([
      const Transaction(id: '3', amount: 3000),
      const Transaction(id: '4', amount: 4000)
    ]),
  )
]);

void main() => runApp(App());

class App extends StatelessWidget {
  App({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) => MaterialApp.router(
        routerConfig: _router,
        title: "Query Params",
        debugShowCheckedModeBanner: false,
      );

  late final GoRouter _router = GoRouter(
    routes: <GoRoute>[
      GoRoute(
        path: '/',
        builder: (BuildContext context, GoRouterState state) =>
            const HomeScreen(),
        routes: <GoRoute>[
          GoRoute(
              name: 'account',
              path: 'account/:accountId',
              builder: (BuildContext context, GoRouterState state) {
                return AccountScreen(
                  accountId: state.params['accountId']!,
                );
              }),
        ],
      ),
    ],
  );
}

class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: const Color(0xFFFF6200),
        title: const Text("Query Params"),
      ),
      body: ListView.builder(
          padding: const EdgeInsets.all(8),
          itemCount: _accounts.length,
          itemBuilder: (BuildContext context, int index) {
            return ListTile(
              title: Text(_accounts[index].id),
              onTap: () => context.go('/account/${_accounts[index].id}'),
            );
          }),
    );
  }
}

class AccountScreen extends StatelessWidget {
  const AccountScreen({required this.accountId, Key? key}) : super(key: key);

  final String accountId;

  @override
  Widget build(BuildContext context) {
    final List<int> amounts = _accounts
        .firstWhere((account) => account.id == accountId)
        .transactions
        .map((e) => e.amount)
        .toList();

    return Scaffold(
      appBar: AppBar(
        backgroundColor: const Color(0xFFFF6200),
        title: Text(accountId),
      ),
      body: ListView.builder(
          padding: const EdgeInsets.all(8),
          itemCount: amounts.length,
          itemBuilder: (BuildContext context, int index) {
            return ListTile(
              title: Text(amounts[index].toString()),
            );
          }),
    );
  }
}