junes_flutter_architecture 是一个帮助开发者快速构建 Flutter 应用程序的架构设计插件。它基于常见的架构模式（如 MVVM、Clean Architecture 等）提供了一套标准化的代码结构和工具，以简化开发流程并提高代码的可维护性。

以下是使用 junes_flutter_architecture 的基本步骤和示例：

1. 安装插件

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

dependencies:
  junes_flutter_architecture: ^1.0.0

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

2. 项目结构

junes_flutter_architecture 建议的项目结构通常包括以下几个主要部分：

• models: 数据模型类
• repositories: 数据仓库，负责与数据源（如 API、数据库）交互
• viewmodels: 视图模型，负责处理业务逻辑
• views: 用户界面组件
• services: 服务层，提供通用的功能（如网络请求、本地存储等）

3. 创建模型

在 models 目录下创建数据模型类。例如：

class User {
  final String id;
  final String name;
  final String email;

  User({required this.id, required this.name, required this.email});

  factory User.fromJson(Map<String, dynamic> json) {
    return User(
      id: json['id'],
      name: json['name'],
      email: json['email'],
    );
  }

  Map<String, dynamic> toJson() {
    return {
      'id': id,
      'name': name,
      'email': email,
    };
  }
}

4. 创建仓库

在 repositories 目录下创建数据仓库类。例如：

import 'package:junes_flutter_architecture/junes_flutter_architecture.dart';
import '../models/user.dart';

class UserRepository {
  final ApiService _apiService = ApiService();

  Future<User> getUser(String userId) async {
    final response = await _apiService.get('/users/$userId');
    return User.fromJson(response);
  }
}

5. 创建视图模型

在 viewmodels 目录下创建视图模型类。例如：

import 'package:junes_flutter_architecture/junes_flutter_architecture.dart';
import '../repositories/user_repository.dart';
import '../models/user.dart';

class UserViewModel extends BaseViewModel {
  final UserRepository _userRepository = UserRepository();
  User? _user;

  User? get user => _user;

  Future<void> fetchUser(String userId) async {
    setBusy(true);
    try {
      _user = await _userRepository.getUser(userId);
    } catch (e) {
      setError(e);
    } finally {
      setBusy(false);
    }
  }
}

6. 创建视图

在 views 目录下创建用户界面组件。例如：

import 'package:flutter/material.dart';
import 'package:junes_flutter_architecture/junes_flutter_architecture.dart';
import '../viewmodels/user_viewmodel.dart';

class UserView extends StatelessWidget {
  final UserViewModel _viewModel = UserViewModel();

  [@override](/user/override)
  Widget build(BuildContext context) {
    return ViewModelProvider<UserViewModel>.withConsumer(
      viewModel: _viewModel,
      onModelReady: (model) => model.fetchUser('1'),
      builder: (context, model, child) {
        if (model.isBusy) {
          return Center(child: CircularProgressIndicator());
        }

        if (model.hasError) {
          return Center(child: Text('Error: ${model.error}'));
        }

        return Scaffold(
          appBar: AppBar(
            title: Text('User Profile'),
          ),
          body: Center(
            child: Text('User Name: ${model.user?.name}'),
          ),
        );
      },
    );
  }
}

7. 运行应用程序

最后，在 main.dart 中运行你的应用程序：

import 'package:flutter/material.dart';
import 'views/user_view.dart';

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

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