A go_router kontextus használata a Flutter.context és a goNamed.Take az Error Redirection útvonal ismeretlen útvonalainak kezelésére.

Átirányítás a Flutter hibaoldalára a go_router használatával: Több megoldás

Dart megoldás a context.go használatával, útvonalellenőrzéssel és hibakezeléssel

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());
}

Elnevezett útvonalak és hibakezelés használata a go_router navigációhoz

Alternatív Dart megoldás a context.goNamed használatával egyéni hibakezeléssel

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());
}

Hibakezelés tesztelése egységtesztekkel

Egységtesztek az útválasztás és a hibakezelés ellenőrzéséhez a Flutterben

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);
  });
}

Gyakran ismételt kérdések a Flutter go_router használatával kapcsolatban

1. Mi az elsődleges célja context.go a go_routerben?
2. A context.go A parancs a közvetlen útvonalnavigációra szolgál egy útvonal megadásával, a felhasználók átirányításával egy hibaoldalra, ha az útvonal nem létezik.
3. Miért context.goNamed kivételt dobni egy nem létező útvonal elérésekor?
4. A context.goNamed A parancs meghatározott útvonalnevekre támaszkodik, így ha egy név nincs megadva, akkor nem tudja megtalálni az elérési utat, és az átirányítás helyett hibát fog kiütni.
5. Hogyan kezelhetem az útvonalhibákat a go_router egyéni hibaoldalával?
6. Beállítása a errorBuilder paraméter a go_router konfigurációkban lehetővé teszi, hogy egyéni hibaoldalt adjon meg minden nem definiált útvonalhoz.
7. Lehetséges mindkettőt használni context.go és context.goNamed ugyanabban az alkalmazásban?
8. Igen, mindkettő context.go és context.goNamed használható ugyanabban az alkalmazásban, de gondos hibakezeléssel, hogy elkerülje a váratlan kivételeket a nem meghatározott nevek esetén.
9. Mi az pumpAndSettle a Flutter tesztben?
10. A pumpAndSettle A Flutter-tesztelés funkciója megvárja az összes animáció befejezését, és győződjön meg arról, hogy a felület rendeződött, mielőtt állításokat tesz.
11. Hogyan testWidgets segítség az útvonalkezelés tesztelésében?
12. A testWidgets A parancs lehetővé teszi az interakciók tesztelését, például a gombnyomásokat és az útvonalátmeneteket, segítve annak ellenőrzését, hogy a hibaoldal a várt módon betöltődik-e érvénytelen útvonalakon.
13. Feltételesen navigálhatok egy útvonalra a go_router használatával?
14. Igen, használatával context.canGo navigáció előtt ellenőrizheti, hogy létezik-e útvonal, és megelőzheti a hibákat azáltal, hogy csak érvényes útvonalakat ér el.
15. Mi az előnye a használatnak MaterialApp.router a go_routerrel?
16. MaterialApp.router Az útválasztási beállításokhoz optimalizálva, lehetővé téve a dinamikus oldalmódosításokat és a hibakezelési integrációt a következőn keresztül routerDelegate és routeInformationParser.
17. Van hatással a teljesítményre az errorBuilder használata a go_routerben?
18. Nincs jelentős hatás. A errorBuilder A funkció csak érvénytelen útvonal elérésekor kerül meghívásra, így hatékonyan kezeli az éles eseteket anélkül, hogy befolyásolná az általános teljesítményt.
19. Hogyan határozhatok meg elnevezett útvonalat a go_routerben?
20. A go_routerben adjon meg egy elnevezett útvonalat hozzáadással name paramétert az útvonal konfigurációjában, és használja context.goNamed hogy ezzel a névvel navigáljon.
21. Mi haszna findsOneWidget a Flutter tesztben?
22. findsOneWidget A Flutter tesztekben használják annak ellenőrzésére, hogy egy widget egyetlen példánya jelen van-e a képernyőn, például annak ellenőrzésére, hogy megjelenik-e egyszer hibaüzenet.
23. Szükséges-e használni errorBuilder ismeretlen útvonalak kezelésére a go_routerben?
24. Bár nem kötelező, de használata errorBuilder javítja a felhasználói élményt azáltal, hogy egyértelmű visszajelzést ad az ismeretlen útvonalakról, és elvezeti a felhasználókat a megszakadt utaktól.

Hatékony útvonalkezelés a Flutterben

Flutteré go_router csomag dinamikus módot kínál a navigáció vezérlésére megbízható útvonalellenőrzéssel. A context.go és a context.goNamed testreszabott hibakezeléssel történő használatával a fejlesztők biztosíthatják, hogy az ismeretlen útvonalak egy barátságos hibaoldalra vezessék a felhasználókat ahelyett, hogy kivételeket dobnának ki. Ez a megközelítés leegyszerűsíti az alkalmazásokban való navigációt, és folyamatosan tájékoztatja a felhasználókat.

A context.go és a context.goNamed közötti beállítás és különbségek megértése jobb navigációs vezérlést tesz lehetővé, különösen az összetett útvonalszerkezettel rendelkező alkalmazások esetében. Ezekkel az eszközökkel a hibák kezelése egyszerűbbé válik, javítva az alkalmazások megbízhatóságát, és kevesebb megszakítással javítja a felhasználói utat. 🌟