Flutter ：实现下拉刷新

Flutter ：实现下拉刷新

效果如图所示

下拉刷新

准备工作：首先创建好一个ListView，并展示相应的数据

• 借助RefreshIndicator，将ListView包裹在其中

RefreshIndicator(
            child: ListView.builder(
            itemCount: _datas.length,
            itemBuilder: _cellForRow,
          ),
        ),

• 实现RefreshIndicator中的onRefresh方法

Future _pullRefresh() async{
    _datas.clear();
    getDatas()
        .then((List<Chat> datas){
      if (!_cancelConnect){
        setState(() {
          _datas.addAll(datas);
        });
      }
    })
        .catchError((e){
      print('错误：${e}');
    })
        .whenComplete((){
      print('完毕了！');
    })
        .timeout(Duration(seconds: 1))
        .catchError((timeout){
      _cancelConnect = true;
      print('超时输出:$timeout');
    });
  }

RefreshIndicator(
          onRefresh: _pullRefresh,
          child: ListView.builder(
            itemCount: _datas.length,
            itemBuilder: _cellForRow,
          ),
        ),

注意：
1、在_pullRefresh加载数据必须是异步的
2、网络重新获取的数据必须在setState中刷新，否则无效，数据不会刷新

完整demo地址中的wechat_app_1