聊聊Flutter - 请求接口以及DAO层的实现

Flutter 中除了布局还有最重要的网络及数据操作.

Flutter的model层如何实现?

class HomeModel { final ConfigModel config; final List<CommonModel> bannerList; final List<CommonModel> localNavList; final GridNavModel gridNav; final List<CommonModel> subNavList; HomeModel( {this.config, this.bannerList, this.localNavList, this.gridNav, this.subNavList}); Map<String, dynamic> toJson() { return { 'config': config, 'bannerList': bannerList, 'localNavList': localNavList, 'gridNav': gridNav, 'subNavList': subNavList, }; } factory HomeModel.fromJson(Map<String, dynamic> json) { var localNavListJson = json['localNavList'] as List; //转换为list List<CommonModel> localNavList = localNavListJson .map((i) => CommonModel.fromJson(i)) .toList(); //然后将list 转换为对应 var bannerListJson = json['bannerList'] as List; //转换为list List<CommonModel> bannerList = bannerListJson .map((i) => CommonModel.fromJson(i)) .toList(); //然后将list 转换为对应 var subNavListJson = json['subNavList'] as List; //转换为list List<CommonModel> subNavList = subNavListJson .map((i) => CommonModel.fromJson(i)) .toList(); //然后将list 转换为对应 return HomeModel( config: ConfigModel.fromJson(json['config']), bannerList: bannerList, localNavList: localNavList, gridNav: GridNavModel.formJson(json['gridNav']), subNavList: subNavList, ); } }

 

如果用到了其他的model实例,需要实现fromJson

class CommonModel { final String icon; final String title; final String url; final String statusBarColor; final bool hideAppBar; CommonModel( {this.icon, this.title, this.url, this.statusBarColor, this.hideAppBar}); /// 需要转换为json字符串时需要此方法 Map<String, dynamic> toJson() { return { 'icon': icon, 'title': title, 'url': url, 'statusBarColor': statusBarColor, 'hideAppBar': hideAppBar, }; } ///获取CommonModel的实例 factory CommonModel.fromJson(Map<String, dynamic> json) { return CommonModel( icon: json['icon'], title: json['title'], url: json['url'], statusBarColor: json['statusBarColor'], hideAppBar: json['hideAppBar']); } }

 

Flutter 请求网络获取返回的数据
需要导入几个包

import 'dart:async'; import 'dart:convert'; import 'package:http/http.dart' as http; //给某个包设置一个别名

 

异步获取网络返回的数据

import 'package:prim_fultter_app/model/home_model.dart'; const Home_URL = "http://www.devio.org/io/flutter_app/json/home_page.json"; //首页接口 class HomeDao { static Future<HomeModel> fetch() async { final response = await http.get(Home_URL); if (response.statusCode == 200) { //判断接口是否返回成功 Utf8Decoder utf8decoder = Utf8Decoder(); //解决中文乱码的问题 var result = json.decode(utf8decoder.convert(response.bodyBytes)); //解码 return HomeModel.fromJson(result); } else { throw Exception('load url fail!'); } } }

 

获取结果的几种方式

Future<Null> loadData() async { //一种方式 // HomeDao.fetch().then((result) { // //转换json字符串 // resultString = json.encode(result.config);//将model转换为json字符串 // print("homeDao:" + resultString); // }).catchError((e) { // resultString = e.toString(); // print("homeDao:" + resultString); // }); //另一种方式 try { HomeModel model = await HomeDao.fetch(); resultString = json.encode(model);//将model转换为json字符串 print("homeDao:" + resultString); } catch (e) { print(e.toString()); } return null; }

 

文章作者: JakePrim

文章链接: https://jakeprim.cn/2019/03/26/flutter-1-2/

版权声明: 本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 JakePrim技术研究院！