Gebruik de context van go_router om onbekende routes in Flutter.context af te handelen versus goNamed. Neem de Error Redirection-route.

Omleiden naar een foutpagina in Flutter met go_router: meerdere oplossingen

Dartoplossing met context.go met routevalidatie en foutafhandeling

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
class ErrorPage extends StatelessWidget {
  const ErrorPage({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Error')),
      body: const Center(
        child: Text('404 - Page Not Found', style: TextStyle(fontSize: 24)),
      ),
    );
  }
}
class HomePage extends StatelessWidget {
  const HomePage({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            if (context.canGo('/non-existent')) {
              context.go('/non-existent');
            } else {
              context.go('/error');
            }
          },
          child: const Text('Go to Non-Existent Page'),
        ),
      ),
    );
  }
}
class MyApp extends StatelessWidget {
  final GoRouter _router = GoRouter(
    routes: <RouteBase>[
      GoRoute(path: '/', builder: (context, state) => const HomePage()),
      GoRoute(path: '/error', builder: (context, state) => const ErrorPage()),
    ],
    errorBuilder: (context, state) => const ErrorPage(),
  );
  MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerDelegate: _router.routerDelegate,
      routeInformationProvider: _router.routeInformationProvider,
      routeInformationParser: _router.routeInformationParser,
    );
  }
}
void main() {
  runApp(MyApp());
}

Gebruik van benoemde routes en foutafhandeling voor go_router-navigatie

Alternatieve Dart-oplossing met context.goNamed met aangepaste foutafhandeling

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
class ErrorPage extends StatelessWidget {
  const ErrorPage({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Error')),
      body: const Center(
        child: Text('404 - Page Not Found', style: TextStyle(fontSize: 24)),
      ),
    );
  }
}
class HomePage extends StatelessWidget {
  const HomePage({super.key});
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Home')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            try {
              context.goNamed('nonExistentRoute');
            } catch (e) {
              context.go('/error');
            }
          },
          child: const Text('Go to Non-Existent Page'),
        ),
      ),
    );
  }
}
class MyApp extends StatelessWidget {
  final GoRouter _router = GoRouter(
    routes: <RouteBase>[
      GoRoute(path: '/', builder: (context, state) => const HomePage()),
      GoRoute(path: '/error', builder: (context, state) => const ErrorPage()),
    ],
    errorBuilder: (context, state) => const ErrorPage(),
  );
  MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerDelegate: _router.routerDelegate,
      routeInformationProvider: _router.routeInformationProvider,
      routeInformationParser: _router.routeInformationParser,
    );
  }
}
void main() {
  runApp(MyApp());
}

Afhandeling van testfouten met unittests

Eenheidstests voor het controleren van routering en foutafhandeling in Flutter

import 'package:flutter_test/flutter_test.dart';
import 'package:go_router/go_router.dart';
import 'package:your_app/main.dart';
void main() {
  testWidgets('Navigate to non-existent page using context.go()', (WidgetTester tester) async {
    await tester.pumpWidget(MyApp());
    expect(find.text('Home'), findsOneWidget);
    await tester.tap(find.text('Go to Non-Existent Page'));
    await tester.pumpAndSettle();
    expect(find.text('404 - Page Not Found'), findsOneWidget);
  });
  testWidgets('Handle exception with context.goNamed()', (WidgetTester tester) async {
    await tester.pumpWidget(MyApp());
    expect(find.text('Home'), findsOneWidget);
    await tester.tap(find.text('Go to Non-Existent Page'));
    await tester.pumpAndSettle();
    expect(find.text('404 - Page Not Found'), findsOneWidget);
  });
}

Veelgestelde vragen over het gebruik van Flutter go_router

1. Wat is het voornaamste doel van context.go in go_router?
2. De context.go De opdracht wordt gebruikt voor directe routenavigatie door een pad op te geven, waardoor gebruikers naar een foutpagina worden omgeleid als de route niet bestaat.
3. Waarom wel context.goNamed een uitzondering genereren bij toegang tot een niet-bestaande route?
4. De context.goNamed commando is afhankelijk van gedefinieerde routenamen, dus als er geen naam is gedefinieerd, kan het het pad niet vinden en zal het een fout genereren in plaats van omleiden.
5. Hoe kan ik routefouten afhandelen met een aangepaste foutpagina in go_router?
6. Het opzetten van de errorBuilder Met de parameter in go_router-configuraties kunt u een aangepaste foutpagina opgeven voor ongedefinieerde routes.
7. Is het mogelijk om beide te gebruiken? context.go En context.goNamed in dezelfde app?
8. Ja, allebei context.go En context.goNamed kan in dezelfde app worden gebruikt, maar met zorgvuldige foutafhandeling om onverwachte uitzonderingen voor ongedefinieerde namen te voorkomen.
9. Wat is pumpAndSettle bij Flutter-testen?
10. De pumpAndSettle De functie bij Flutter-testen wacht tot alle animaties zijn voltooid en zorgt ervoor dat de interface tot rust is gekomen voordat er uitspraken worden gedaan.
11. Hoe werkt testWidgets hulp bij het testen van routeafhandeling?
12. De testWidgets Met deze opdracht kunt u interacties testen, zoals het indrukken van knoppen en route-overgangen, zodat u kunt verifiëren of de foutpagina op ongeldige routes wordt geladen zoals verwacht.
13. Kan ik voorwaardelijk naar een route navigeren met go_router?
14. Ja, door te gebruiken context.canGo Voordat u gaat navigeren, kunt u controleren of er een route bestaat en fouten voorkomen door alleen toegang te krijgen tot geldige paden.
15. Wat is het voordeel van het gebruik MaterialApp.router met go_router?
16. MaterialApp.router is geoptimaliseerd voor routeringsinstellingen, waardoor dynamische paginawijzigingen en foutafhandelingsintegratie mogelijk zijn via routerDelegate En routeInformationParser.
17. Heeft het gebruik van errorBuilder in go_router invloed op de prestaties?
18. Geen significante impact. De errorBuilder De functie wordt alleen aangeroepen als er toegang wordt verkregen tot een ongeldige route, waardoor deze efficiënt is voor het afhandelen van randgevallen zonder de algehele prestaties te beïnvloeden.
19. Hoe definieer ik een benoemde route in go_router?
20. Definieer in go_router een benoemde route door toe te voegen name parameter in de routeconfiguratie en gebruik context.goNamed om met deze naam te navigeren.
21. Wat is het nut van findsOneWidget bij Flutter-testen?
22. findsOneWidget wordt gebruikt in Flutter-tests om te verifiëren dat één exemplaar van een widget op het scherm aanwezig is, bijvoorbeeld om te controleren of er één keer een foutmelding verschijnt.
23. Is het nodig om te gebruiken errorBuilder voor het afhandelen van onbekende routes in go_router?
24. Hoewel niet verplicht, gebruiken errorBuilder verbetert de gebruikerservaring door duidelijke feedback te geven over onbekende routes en gebruikers weg te leiden van gebroken paden.

Effectief routebeheer in Flutter

Flutter's go_router pakket biedt een dynamische manier om navigatie te controleren met betrouwbare routevalidatie. Door context.go en context.goNamed te gebruiken met aangepaste foutafhandeling, kunnen ontwikkelaars ervoor zorgen dat onbekende routes gebruikers naar een vriendelijke foutpagina leiden in plaats van uitzonderingen te genereren. Deze aanpak stroomlijnt de app-navigatie en houdt gebruikers op de hoogte.

Inzicht in de opzet en verschillen tussen context.go en context.goNamed maakt een betere navigatiecontrole mogelijk, vooral voor toepassingen met complexe routestructuren. Met deze tools wordt het omgaan met fouten eenvoudiger, waardoor de betrouwbaarheid van de app wordt verbeterd en het algehele gebruikerstraject wordt verbeterd met minder onderbrekingen. 🌟