Nuvigator 是一个用于 Flutter 的路由管理插件，它基于 Navigator 2.0 构建，提供了更强大和灵活的路由管理功能。与传统的 Navigator 1.0 相比，Nuvigator 允许开发者更好地控制路由堆栈，并支持深层链接、嵌套导航等高级功能。

安装 Nuvigator

首先，你需要在 pubspec.yaml 文件中添加 nuvigator 依赖：

dependencies:
  flutter:
    sdk: flutter
  nuvigator: ^0.6.0

然后运行 flutter pub get 来安装依赖。

基本用法

1. 创建路由

Nuvigator 使用 NuvigatorRouter 来定义路由。你可以通过继承 NuvigatorRouter 来创建自定义路由。

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

class MyRouter extends NuvigatorRouter {
  [@override](/user/override)
  String get initialRoute => 'home';

  [@override](/user/override)
  Map<String, NuRoute> get registerRoutes => {
        'home': NuRouteBuilder(
          path: 'home',
          builder: (BuildContext context, NuRouteSettings settings) {
            return HomeScreen();
          },
        ),
        'details': NuRouteBuilder(
          path: 'details',
          builder: (BuildContext context, NuRouteSettings settings) {
            final args = settings.rawParameters;
            return DetailsScreen(id: args['id']);
          },
        ),
      };
}

2. 使用 Nuvigator

在 MaterialApp 或 CupertinoApp 中，使用 Nuvigator 来管理路由。

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Nuvigator Example',
      home: Nuvigator(
        router: MyRouter(),
      ),
    );
  }
}

3. 导航

在 Nuvigator 中，你可以使用 NuRouter.of(context) 来获取当前的 NuRouter 实例，并进行导航。

class HomeScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            final router = NuRouter.of(context);
            router.pushNamed('details', parameters: {'id': '123'});
          },
          child: Text('Go to Details'),
        ),
      ),
    );
  }
}

class DetailsScreen extends StatelessWidget {
  final String id;

  DetailsScreen({required this.id});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Details'),
      ),
      body: Center(
        child: Text('Details for ID: $id'),
      ),
    );
  }
}

嵌套导航

Nuvigator 支持嵌套导航，可以在一个页面中嵌入另一个 Nuvigator 实例。

class NestedRouter extends NuvigatorRouter {
  [@override](/user/override)
  String get initialRoute => 'nestedHome';

  [@override](/user/override)
  Map<String, NuRoute> get registerRoutes => {
        'nestedHome': NuRouteBuilder(
          path: 'nestedHome',
          builder: (BuildContext context, NuRouteSettings settings) {
            return NestedHomeScreen();
          },
        ),
        'nestedDetails': NuRouteBuilder(
          path: 'nestedDetails',
          builder: (BuildContext context, NuRouteSettings settings) {
            final args = settings.rawParameters;
            return NestedDetailsScreen(id: args['id']);
          },
        ),
      };
}

class NestedHomeScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Nested Home'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            final router = NuRouter.of(context);
            router.pushNamed('nestedDetails', parameters: {'id': '456'});
          },
          child: Text('Go to Nested Details'),
        ),
      ),
    );
  }
}

class NestedDetailsScreen extends StatelessWidget {
  final String id;

  NestedDetailsScreen({required this.id});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Nested Details'),
      ),
      body: Center(
        child: Text('Nested Details for ID: $id'),
      ),
    );
  }
}

在父路由中嵌入 Nuvigator：

class HomeScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
      ),
      body: Column(
        children: [
          ElevatedButton(
            onPressed: () {
              final router = NuRouter.of(context);
              router.pushNamed('details', parameters: {'id': '123'});
            },
            child: Text('Go to Details'),
          ),
          Expanded(
            child: Nuvigator(
              router: NestedRouter(),
            ),
          ),
        ],
      ),
    );
  }
}