flutter刷新页面_Flutter 数据绑定, list刷新加载, 加载webView

前言

上篇文章介绍了展示列表的构建. 片尾预告了这篇文章的内容, 主要包括列表的刷新,加载, 导航跳转详情web页面. 网络数据请求. 绑定数据. 效果图如下:

1.gif

网络请求

使用开源库dio: ^1.0.6进行的网络请求.简单易用.另附一个三方库查询地址地址. 方便查找需要用到的资源与轮子

pubspec.yaml上添加dio库.进行一下简单的封装, 新建一个apiUtils.dart文件, 如下

import 'package:dio/dio.dart';

import 'dart:async';

var dio = new Dio();

class ApiUtils {

static Future get(String url,{Map params}) async{

var response = await dio.get(url, data: params);

return response.data;

}

static Future post(String url,Map params) async{

var response = await dio.post(url, data: params);

return response.data;

}

}

然后在已入该文件进行网络请求

Future _getListData([Map params]) async {

// URL地址

const juejin_flutter =

'https://timeline-merger-ms.juejin.im/v1/get_tag_entry?src=web&tagId=5a96291f6fb9a0535b535438';

var pageIndex = (params is Map) ? params['pageIndex'] : 0;

// 参数

final _param = {'page': pageIndex, 'pageSize': 20, 'sort': 'rankIndex'};

// 返回结果

var response = await ApiUtils.get(juejin_flutter, params: _param);

var responseList = response['d']['entrylist'];

var pageTotal = response['d']['total'];

var pageSize = 20;

if (!(pageTotal is int) || pageTotal <= 0) {

pageTotal = 0;

}

pageIndex += 1;

List resultList = new List();

for (int i = 0; i < responseList.length; i++) {

try {

// json数据转化model

NewsModel cellData = new NewsModel.fromJson(responseList[i]);

resultList.add(cellData);

} catch (e) {

// No specified type, handles all

}

}

// 刷新页面

setState(() {