Flutter 初始化数据完成后再加载页面
一、初始化数据完成后再加载数据
1、为了达成这个目标尝试了多种方法总是失败
在Init 和didChangeDependencies
初始化数据过也不行
@override
void didChangeDependencies() {
//getcplist();
WidgetsBinding.instance.addPostFrameCallback((tim) {
getcplist();
});
super.didChangeDependencies();
}
尝试使用FutureBuilder 来解决问题,但是要解决FutureBuilder 当调用setstate的时候,将会刷新整个FutureBuilder,结果会是重新请求数据,造成了不必要的请求和资源浪费。
正确的代码如下
class CppageState extends State<Cppage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
body: Consumer<CouponProvider>(builder: (context,CouponProvider cplst,Child) {
return Column(
children: <Widget>[
Container(
padding: EdgeInsets.only(top: 5.0,bottom: ),
child: ShowpayWidget(),),
Expanded(
child:
FutureBuilder(
future: _futureBuilderFuture,
builder: (BuildContext context, AsyncSnapshot snapShot)
{
if (snapShot.connectionState== ConnectionState.waiting)
{
return Center(child: Text('Data is Loading...'),);
} else if (snapShot.connectionState == ConnectionState.done) {
print(snapShot.hasError);
print('data:${snapShot.data}');}
if (snapShot.hasError) {
return Text('Error: ${snapShot.error}');
}
return GridView.builder(
shrinkWrap: true,
itemCount: cplst.couponlst.bfcrmResp.voucherList.length,
// physics: NeverScrollableScrollPhysics(),//禁止滚动
padding: EdgeInsets.symmetric(horizontal: ),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: ,
mainAxisSpacing: ,
crossAxisSpacing: ,
childAspectRatio: ,
),
itemBuilder: (context, index) {
return Cpitem(cplst.couponlst.bfcrmResp.voucherList[index]);
},
);
}
)
)
],
);
// );
})
); } Future getcplist() async
{
print('xxxxxxxxxxx');
await Provider.of<CouponProvider>(context,listen: false).getCouponlist(); } var _futureBuilderFuture;
@override
void initState() {
print('');
_futureBuilderFuture =getcplist();
super.initState();
}
二、多网络请求时
其中getDelegationData ,getData是两个单独的网络请求,写法如下
Future getData() async {
var data = {
'iReq': "BTC_USDT",
};
TradeInfo response = await TradeService.getData(this, data.toString());
}
getDelegationData一样,不再给出,这样的话等两个请求都结束之后会返回一个新的Future到我们的FutureBuilder
if (snapShot.connectionState == ConnectionState.waiting) {
return Text('Loading...');
} else if (snapShot.connectionState == ConnectionState.done) {
print(snapShot.hasError);
print('data:${snapShot.data}');
if (snapShot.hasError) {
return Text('Error: ${snapShot.error}');
}
这里的话就用到了snapShot的几种状态,用来判断网络请求处于哪一个阶段,等待(请求中),done完成,包括如果请求有异常的话,我们可以打印出来 return Text(‘Error: ${snapShot.error}’);
注意事项:
这里有一个情况就是我们在调用Future.wait([getDelegationData(), getData()]);的时候,请求网络的顺序是按参数的先后顺序执行的,先走getDelegationData请求,再走getData,但是返回数据结果的顺序却不能保证,因为是根据请求需要的时间决定的,异步的,所以我们尽量把数据处理放在ConnectionState.done之后再处理。
多网络请求如何控制顺序:
另外如果你的网络请求有逻辑关系,比如第一个接口的返回值要当做第二个接口的请求参数,那么写法如下
Future testThen2() asyn {
Future getDatas() async {
return getDelegationData().then((e){
getData();
});
}
// 请求顺序是从外层到里层即 getDatas=====getDelegationData===getData
详转自于:https://blog.csdn.net/u013095264/article/details/99977917#_43
Flutter 初始化数据完成后再加载页面的更多相关文章
- .js控制一次加载一张图片,加载完后再加载下一张
js怎么控制一次加载一张图片,加载完后再加载下一张 (1)方法1 (1)方法2
- ant design pro解决初始加载,有顺序的请求/请求顺序报错问题/登录后再加载其他数据/异步的顺序问题/偷跑
方法是:如在Authorized.jsx中解决,当未登录成功(包括登录失败和登录验证中),就显示loading,否则继续 加载渲染children 一个三目运算或者if分支就可以解决,但是要写到最先加 ...
- jquery循环延迟加载,用于在图片加载完成后再加载js
<html> <head> <script type="text/javascript" src="http://lib.sinaapp.c ...
- 网页图片很多时,加载完后再加载图片(defer:延迟加载)
图片影响页面加载速度,可以先加载完页面,再去加载图片. defer:告诉浏览器,这里面的js代码不影响网页脚本解析,可以解析完html脚本再执行这段js代码(个人理解). 网页代码:<img s ...
- 如何在AngularJS渲染后再加载JS
http://www.itnose.net/detail/6100484.html app.directive('repeatDone', function () { return function ...
- flutter 入口文件配置路由+加载页面
入口文件配置路由 1.路由信息 -- 加载页面 ,通常用于显示新的内容或者广告,加载完成之后进入主页面 -- 主页面 /app 2.配置页面 main.dart main.dart // main ...
- DataTable 删除数据后重新加载
DataTable 删除数据后重新加载 一.总结 一句话总结: 判断datatable是否被datatable初始化或者是否执行了datatable销毁函数,如果没有,就销毁它 if ($('#dat ...
- 精尽MyBatis源码分析 - MyBatis初始化(二)之加载Mapper接口与XML映射文件
该系列文档是本人在学习 Mybatis 的源码过程中总结下来的,可能对读者不太友好,请结合我的源码注释(Mybatis源码分析 GitHub 地址.Mybatis-Spring 源码分析 GitHub ...
- 爬虫再探实战(三)———爬取动态加载页面——selenium
自学python爬虫也快半年了,在目前看来,我面临着三个待解决的爬虫技术方面的问题:动态加载,多线程并发抓取,模拟登陆.目前正在不断学习相关知识.下面简单写一下用selenium处理动态加载页面相关的 ...
随机推荐
- php去掉字符串中的最后一个字符和汉字
###php去掉字符串中的最后一个字符和汉字 1.php去掉字符串中的最后一个字符: //方法一: $newstr = substr($str,0,strlen($str)-1); //方法二: $n ...
- Python--jsonpath
JsonPath是一种信息抽取类库,是从JSON文档中抽取指定信息的工具,提供多种原因实现保本:JavaScript/Python/PHP和Java. 使用方法如: import jsonpathre ...
- oddo
看了这张图,或许你对odoo有了一些兴趣. https://www.cnblogs.com/wterp/p/9093616.html 这次就是和大家一起交流开源ERP/CRM系统:odoo 对以下读者 ...
- 【数据结构 Python & C++】顺序表
用C++ 和 Python实现顺序表的简单操作 C++代码 // Date:2019.7.31 // Author:Yushow Jue #include<iostream> using ...
- 选择排序——C语言
选择排序 1.算法描述 首先在未排序序列中找到最小(大)元素,存放到排序序列的起始位置,然后,再从剩余未排序元素中继续寻找最小(大)元素,然后放到已排序序列的末尾.以此类推,直到所有元素均排序完毕(放 ...
- Angular 调试
我们新建一个项目.执行 ng server 会启动一个网站. 1. 执行 where ng .看看ng 是什么. D:\Abp学习\angular\Mytest>where ng C:\User ...
- JS做2048
首先我们了解一下2048这个游戏的原理: 他由一个4x4二维数组组成,在游戏一开始时候在随机位置随机生成一个2或者4 如: 1.每点击一次开始就刷新一次游戏界面: 2.通过键盘的上下左右四个方向键分别 ...
- input 默认提示文字 样式修改(颜色,大小,位置)
input::-webkit-input-placeholder{ color:red; font-size:20px; ...... }
- 关于WEB前端开发的思考与感悟
万事开头难. 当我想要认真写一篇文章向大家分享我对前端的认识与感悟的时候,突然就深刻的体会到了这句话确实太有道理了. 最近几年对于web前端的传闻很多,比如人才稀缺,简单易学,待遇丰厚,整体势头发展良 ...
- CircularSlider半弧形滑动条
前言 这边文章主要 是写 一.半圆弧型滑块的设计 最近项目中需要用到半圆弧形滑块,其作用和UISlider差不多,用于拖动改变播放音乐的播放进度. 大概样子是这样的: 效果展示 特点如下: 滑动响应区 ...