Flutter网络响应处理插件api_response的使用

本仓库包含一个Flutter项目，演示了如何处理API响应。该项目包括HTTP请求、JSON数据解析以及在Flutter应用中显示结果的示例。

功能

• 使用HTTP GET请求从API获取数据
• 解析JSON响应
• 在Flutter UI中显示数据
• 网络请求错误处理

开始使用

要开始使用此项目，请按照以下步骤操作：

1. 克隆仓库：

   git clone https://github.com/yourusername/flutter-api-response.git
   cd flutter-api-response
   

2. 安装依赖：

   flutter pub get
   

3. 运行应用：

   flutter run
   

项目结构

• lib/：包含主Flutter应用代码
  • main.dart：应用入口点
  • api_service.dart：处理API请求和响应
  • models/：包含用于解析JSON的数据模型
  • screens/：包含应用的UI屏幕

依赖项

本项目使用以下依赖项：

• freezed：用于生成不可变数据类
• dartz：用于Dart中的函数式编程

贡献

欢迎贡献！请打开问题或提交拉取请求以进行任何改进或错误修复。

许可证

该项目采用MIT许可证。更多详情请参阅LICENSE文件。

示例代码

main.dart

import 'package:flutter/material.dart';
import 'screens/home_screen.dart';

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter API Response Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomeScreen(),
    );
  }
}

api_service.dart

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'models/api_response.dart';

class ApiService {
  final String url = "https://jsonplaceholder.typicode.com/posts";

  Future<ApiResponse> fetchData() async {
    try {
      final response = await http.get(Uri.parse(url));

      if (response.statusCode == 200) {
        // 成功获取数据
        final List<dynamic> data = json.decode(response.body);
        return ApiResponse.success(data.map((e) => Post.fromJson(e)).toList());
      } else {
        // 处理错误
        return ApiResponse.error("Failed to load posts");
      }
    } catch (e) {
      // 处理异常
      return ApiResponse.error("Exception occurred: $e");
    }
  }
}

models/api_response.dart

import 'package:dartz/dartz.dart';

// 成功响应
class ApiResponse<T> {
  final Either<String, T> _data;

  ApiResponse(this._data);

  bool get isSuccess => _data.isRight();
  bool get isError => _data.isLeft();

  T? get data => _data.getOrElse(() => null);
  String? get error => _data.leftMap((l) => l).toOption().getOrNone();
}

// 错误响应
class ApiError {
  final String message;

  ApiError(this.message);
}

models/post.dart

import 'package:freezed_annotation/freezed_annotation.dart';

part 'post.freezed.dart';
part 'post.g.dart';

@freezed
class Post with _$Post {
  const factory Post({
    required int userId,
    required int id,
    required String title,
    required String body,
  }) = _Post;

  factory Post.fromJson(Map<String, dynamic> json) => _$PostFromJson(json);
}

screens/home_screen.dart

import 'package:flutter/material.dart';
import 'package:flutter_api_response/api_service.dart';
import 'models/post.dart';

class HomeScreen extends StatefulWidget {
  [@override](/user/override)
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  List<Post> _posts = [];
  bool _isLoading = true;

  [@override](/user/override)
  void initState() {
    super.initState();
    fetchData();
  }

  void fetchData() async {
    final apiService = ApiService();
    final response = await apiService.fetchData();

    setState(() {
      _isLoading = false;
      if (response.isSuccess) {
        _posts = response.data!;
      } else {
        print("Error: ${response.error}");
      }
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter API Response Demo'),
      ),
      body: _isLoading
          ? Center(child: CircularProgressIndicator())
          : ListView.builder(
              itemCount: _posts.length,
              itemBuilder: (context, index) {
                final post = _posts[index];
                return ListTile(
                  title: Text(post.title),
                  subtitle: Text(post.body),
                );
              },
            ),
    );
  }
}