Flutter MVC路由管理插件flutter_mvc_router的使用

flutter_mvc_router 是一个用于 Flutter 的 MVC 路由管理插件，它帮助开发者更好地组织和管理应用程序的路由逻辑。通过将路由与 MVC（Model-View-Controller）模式结合，开发者可以更清晰地分离业务逻辑、视图和路由管理。

安装

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

dependencies:
  flutter:
    sdk: flutter
  flutter_mvc_router: ^1.0.0  # 请使用最新版本

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

基本用法

1. 创建路由

首先，你需要定义你的路由。flutter_mvc_router 允许你通过 MvcRoute 类来定义路由。

import 'package:flutter_mvc_router/flutter_mvc_router.dart';

final routes = [
  MvcRoute(
    path: '/',
    controller: HomeController(),
    view: HomeView(),
  ),
  MvcRoute(
    path: '/about',
    controller: AboutController(),
    view: AboutView(),
  ),
];

2. 创建控制器

控制器负责处理业务逻辑。你可以通过继承 MvcController 来创建控制器。

import 'package:flutter_mvc_router/flutter_mvc_router.dart';

class HomeController extends MvcController {
  [@override](/user/override)
  void onInit() {
    // 初始化逻辑
  }

  void navigateToAbout() {
    MvcRouter.pushNamed('/about');
  }
}

3. 创建视图

视图负责展示 UI。你可以通过继承 MvcView 来创建视图。

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

class HomeView extends MvcView<HomeController> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: controller.navigateToAbout,
          child: Text('Go to About'),
        ),
      ),
    );
  }
}

4. 初始化路由

在 main.dart 中初始化路由并启动应用。

import 'package:flutter/material.dart';
import 'package:flutter_mvc_router/flutter_mvc_router.dart';
import 'routes.dart'; // 假设你的路由定义在 routes.dart 文件中

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter MVC Router',
      onGenerateRoute: MvcRouter.generateRoute(routes),
      initialRoute: '/',
    );
  }
}

高级用法

1. 路由参数

你可以通过路由传递参数。

MvcRoute(
  path: '/user/:id',
  controller: UserController(),
  view: UserView(),
);

在控制器中获取参数：

class UserController extends MvcController {
  String userId;

  [@override](/user/override)
  void onInit() {
    userId = MvcRouter.getParam('id');
  }
}

2. 嵌套路由

你可以使用嵌套路由来组织复杂的路由结构。

MvcRoute(
  path: '/dashboard',
  controller: DashboardController(),
  view: DashboardView(),
  children: [
    MvcRoute(
      path: 'profile',
      controller: ProfileController(),
      view: ProfileView(),
    ),
    MvcRoute(
      path: 'settings',
      controller: SettingsController(),
      view: SettingsView(),
    ),
  ],
);

3. 路由守卫

你可以使用路由守卫来控制路由的访问权限。

MvcRoute(
  path: '/admin',
  controller: AdminController(),
  view: AdminView(),
  guards: [AuthGuard()],
);

创建守卫：

class AuthGuard extends MvcGuard {
  [@override](/user/override)
  Future<bool> canActivate() async {
    // 检查用户是否登录
    return isLoggedIn;
  }
}