1、搭建flutter的开发环境：http://www.haijin.xyz/article/730

2、创建一个项目：

flutter create myapp

项目结构：

注意没有展开的包表示并不涉及里面的东西，所以不展开了，如：components和pages包

3、相关代码：

code_api.dart：（这部分代码是变化的，可通过业务代码来调整）

// lib/api/code_api.dart

import '../model/code_model.dart';
import '../network/api_service.dart';
import '../utils/model_util.dart';

class CodeAPI {
  final ApiService _apiService = ApiService();

  void fetchTodoData(int userId) {
    try {
      final body = {'userId': userId}; // 示例查询参数
      _apiService.get(
        url: 'https://jsonplaceholder.typicode.com/todos',
        body: body,
        callbackFunc: (dynamic data) {
          // 在这里处理数据
          final List<CodeModel> codeModels = ModelUtil.convertJsonToList<CodeModel>(data,CodeModel.fromJson);
          print(codeModels[0].id);
        },
      );
    } catch (e) {
      print('Error: $e');
    }
  }
}

code_model.dart：（这部分代码可以直接通过json to dart的插件生成）

/// userId : 1
/// id : 1
/// title : "delectus aut autem"
/// completed : false

class CodeModel {
  CodeModel({
      num? userId,
      num? id,
      String? title,
      bool? completed,}){
    _userId = userId;
    _id = id;
    _title = title;
    _completed = completed;
}

  CodeModel.fromJson(dynamic json) {
    _userId = json['userId'];
    _id = json['id'];
    _title = json['title'];
    _completed = json['completed'];
  }
  num? _userId;
  num? _id;
  String? _title;
  bool? _completed;
CodeModel copyWith({  num? userId,
  num? id,
  String? title,
  bool? completed,
}) => CodeModel(  userId: userId ?? _userId,
  id: id ?? _id,
  title: title ?? _title,
  completed: completed ?? _completed,
);
  num? get userId => _userId;
  num? get id => _id;
  String? get title => _title;
  bool? get completed => _completed;

  Map<String, dynamic> toJson() {
    final map = <String, dynamic>{};
    map['userId'] = _userId;
    map['id'] = _id;
    map['title'] = _title;
    map['completed'] = _completed;
    return map;
  }

}

api_service.dart（这部分代码是不变的，直接复制）：

// lib/network/api_service.dart
import 'dart:convert';
import 'package:dio/dio.dart';

class ApiService {
  final Dio _dio = Dio();

  Future<dynamic> request({
    required String url,
    required String method,
    Map<String, dynamic>? headers,
    dynamic body,
  }) async {
    try {
      final options = Options(method: method.toUpperCase());

      if (headers != null) {
        options.headers = headers;
      }

      final response = await _dio.request(
        url,
        options: options,
        data: body,
      );


      if (response.statusCode == 200 || response.statusCode == 201) {
        return response.data;
      } else {
        throw Exception(
            'Failed to load data with status code: ${response.statusCode}');
      }
    } catch (e) {
      throw Exception('Error: $e');
    }
  }


  Future<void> get({
    required String url,
    dynamic body,
    required Function(dynamic) callbackFunc,
  }) async {
    final queryParameters = body;

    final finalUrl = '$url?${_convertQueryParameters(queryParameters)}';

    print("get请求的地址：$finalUrl");

    final data = await request(
      url: finalUrl,
      method: 'GET',
    );
    // 回调响应的数据
    callbackFunc(data);
  }


  Future<void> post({
    required String url,
    dynamic body,
    required Function(dynamic) callbackFunc,
  }) async {
    final finalBody = body ?? {};

    print("post请求的地址：$url");

    final data = await request(
      url: url,
      method: 'GET',
      body: finalBody,
    );
    // 回调响应的数据
    callbackFunc(data);
  }

  String _convertQueryParameters(Map<String, dynamic>? parameters) {
    if (parameters == null || parameters.isEmpty) {
      return "";
    }

    final List<String> queryParts = [];
    parameters.forEach((key, value) {
      // 如果值为 null，则跳过这个键值对
      if (value == null) return;

      queryParts.add('$key=${Uri.encodeComponent(value.toString())}');
    });

    return queryParts.join('&');
  }

}

model_util.dart（这部分代码是不变的，直接复制）：

// lib/utils/model_util.dart
import 'dart:convert';

class ModelUtil<T> {
  // 将请求返回后的json数组数据转化为某一个实体的集合
  static List<T> convertJsonToList<T>(dynamic data, T Function(dynamic json) fromJson) {
    List<dynamic> jsonData = data;
    List<T> result = jsonData.map((v)=>fromJson(v)).toList();
    return result;
  }

// 将请求返回后的单个json对象转化为指定类型的实体对象
  static T convertJsonToObject<T>(dynamic data, T Function(dynamic json) fromJson) {
    return fromJson(data);
  }

}

这样我们就完成了网络的请求以及json数据的解析。