自学内容网 自学内容网

【Flutter】- go_router路由


知识回顾

前言

go_router 是一个 Flutter 的第三方路由插件,相比 Flutter 自带的路由,go_router 更加灵活,而且简单易用。在 App 应用中,如果你想自己控制路由的定义和管理方式,那么它将十分有用。同时,对于 Web 应用来说,go_router 也提供了很好的支持。 使用 go_router 后,你可以定义 URL 的格式,使用 URL 跳转,处理深度链接以及其他一系列的导航相关的应用场景。

源码分析

1. 初始化

import 'package:enjoy_plus/pages/house/index.dart';
import 'package:enjoy_plus/pages/login/index.dart';
import 'package:enjoy_plus/pages/notice/index.dart';
import 'package:enjoy_plus/pages/profile/index.dart';
import 'package:enjoy_plus/pages/tab_bar_page.dart';
import 'package:enjoy_plus/utils/TokenUtil.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() {
   
  runApp(const MyApp());
}

/// 自定义go_router configuration
final GoRouter _goRouter = GoRouter(
  observers: [
    // Add your navigator observers
    MyNavigatorObserver(),
  ],
  routes: <RouteBase>[
    GoRoute(
      path: '/',
      builder: (context, state) => const TabBarPage(),
      redirect: (context, state) {
   },

      // 全局跳转拦截
      routes: <RouteBase>[
        GoRoute(
          path: 'detail/:id',
          builder: (context, state) {
   
            final id = state.pathParameters['id'];
            return NoticeDetail(
              id: id.toString(),
            );
          },
          // pageBuilder: (context, state) {
   
          //   return CustomTransitionPage(
          //     key: state.pageKey,
          //     transitionsBuilder: (context, animation, secondaryAnimation, child) {
   
          //       // Change the opacity of the screen using a Curve based on the the animation's value
          //       return FadeTransition(
          //         opacity:
          //         CurveTween(curve: Curves.easeInOutCirc).animate(animation),
          //         child: child,
          //       );
          

原文地址:https://blog.csdn.net/sinat_24542619/article/details/142894205

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!