【Flutter&Dart】MVVM(Model-View-ViewModel)架构模式例子-dio版本(31 /100)

动图更精彩

dio & http

在Flutter中,dio和http是两个常用的HTTP请求库,它们各有优缺点。以下是对这两个库的详细对比:

功能特性

http:

功能:提供了基本的HTTP请求和响应功能,如GET、POST、PUT、DELETE等。

易用性:API简单,易于上手。

功能丰富度:功能相对简单,没有提供拦截器、请求取消、请求日志记录等高级功能。

dio:

功能:功能强大,支持多种高级功能,如拦截器、请求取消、请求日志记录、Cookie管理、文件上传/下载、超时设置、自定义适配器等。

易用性:API相对复杂,但提供了丰富的功能和灵活的配置。

功能丰富度:功能丰富,支持多种高级功能,适合复杂的应用场景。

使用方式

http:

dart 复制代码
import 'package:http/http.dart' as http;

void httpNetwork() async {
  final client = http.Client();
  final url = Uri.parse("https://api.example.com/data");
  final response = await client.get(url);
  if (response.statusCode == 200) {
    print(response.body);
  } else {
    print(response.statusCode);
  }
}

dio:

dart 复制代码
import 'package:dio/dio.dart';

void dioNetwork() async {
  Dio dio = Dio();
  final response = await dio.get("https://api.example.com/data");
  if (response.statusCode == 200) {
    print(response.data);
  } else {
    print(response.statusCode);
  }
}

性能比较

http:平均耗时为100ms。

dio:平均耗时为80ms ,性能表现更好。

生态支持

http:

知名度:作为Flutter官方提供的库,具有很高的知名度和活跃度。

文档和社区支持:文档和社区支持完善,易于查找和学习。

dio:

知名度:也具有很高的知名度和活跃度,社区支持良好。

文档和社区支持:提供了详细的文档和示例,社区活跃度高。

结论

简单易用:如果你需要一个简单易用的HTTP请求库,可以选择http。

功能丰富:如果你需要更丰富的功能和更好的性能,可以选择dio

生态支持:http和dio在生态支持方面更加成熟,文档和社区支持完善。

代码:

dart 复制代码
// model

import 'dart:convert';

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class Result {
  String data;

  Result(this.data);
}

//ViewModel
class DioViewModel extends ChangeNotifier {
  Result? _result;
  Result? get result => _result;

  bool _isLoading = false;
  bool get isLoading => _isLoading;

  Future<void> fetchDio() async {
    _isLoading = true;
    notifyListeners();

    var url = 'https://api.apiopen.top/api/sentences';
    // url = 'https://cn.bing.com/';
    final response = await Dio().get(url);

    if (response.statusCode == 200) {
      if (response.data is String) {
        _result = Result(response.data);
      } else {
        var str = json.encode(response.data);
        _result = Result(str);
      }
    } else {
      throw Exception('Failed to load user');
    }
    _isLoading = false;
    notifyListeners();
  }
}

class DioMvvmDemo extends StatelessWidget {
  const DioMvvmDemo({super.key});

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => DioViewModel(),
      child: DioMvvmView(),
    );
  }
}

class DioMvvmView extends StatelessWidget {
  const DioMvvmView({super.key});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Consumer<DioViewModel>(builder: (context, viewModel, child) {
          if (viewModel.isLoading) {
            return Center(
              child: CircularProgressIndicator(),
            );
          } else if (viewModel.result == null) {
            return Center(child: Text('result not found'));
          } else {
            return Text('result=${viewModel.result!.data}');
          }
        }),
        IconButton(
            onPressed: () {
              context.read<DioViewModel>().fetchDio();
            },
            icon: Icon(Icons.send))
      ],
    );
  }
}
相关推荐
weixin_437398217 分钟前
转Go学习笔记
linux·服务器·开发语言·后端·架构·golang
搬砖的小码农_Sky1 小时前
XILINX Zynq-7000系列FPGA的架构
fpga开发·架构
瓜子三百克1 小时前
十、高级概念
flutter
移动开发者1号3 小时前
使用 Android App Bundle 极致压缩应用体积
android·kotlin
移动开发者1号3 小时前
构建高可用线上性能监控体系:从原理到实战
android·kotlin
zkmall4 小时前
企业电商解决方案哪家好?ZKmall模块商城全渠道支持 + 定制化服务更省心
大数据·运维·重构·架构·开源
ii_best7 小时前
按键精灵支持安卓14、15系统,兼容64位环境开发辅助工具
android
美狐美颜sdk8 小时前
跨平台直播美颜SDK集成实录:Android/iOS如何适配贴纸功能
android·人工智能·ios·架构·音视频·美颜sdk·第三方美颜sdk
小雷FansUnion10 小时前
深入理解MCP架构:智能服务编排、上下文管理与动态路由实战
人工智能·架构·大模型·mcp
慌糖11 小时前
微服务介绍
微服务·云原生·架构