在内部使用 Anmiation 时,FutureBuilder 未完成

问题描述

我有一个 FutureBuilder,用于从 Firestore 检索数据。我在 initState 中这样做,正如这里经常建议的那样。

Future<Tour> _tour;

  @override
  void initState() {
    super.initState();
    _tour = _tourService.getTourDataPerEmployee(employeeID: userinfo.user.uid);
  }

我的 FutureBuilder 看起来像这样:

FutureBuilder(
        future: _tour,builder: (context,snapshot) {
          if (snapshot.hasData) {
            print(snapshot.data.waypoints);
            return Container(
                child: ListView.builder(
              itemCount: snapshot.data.waypoints.length,itemBuilder: (context,index) {
                return TimelineTile(
                  nodePosition: 0.03,contents: TourTile(
                    tour: snapshot.data,index: index,),node: TimelineNode(
                    indicator: CustomIndicator(
                        finished: snapshot.data.waypoints[index].finished),startConnector: CustomConnector(
                        finished: snapshot.data.waypoints[index].finished,inProgress: false),endConnector: CustomConnector(
                        finished: snapshot.data.waypoints[index].finished,inProgress: index >= snapshot.data.waypoints.length - 1
                            ? true
                            : snapshot.data.waypoints[index + 1].finished
                                ? false
                                : true),);
              },));
          } else {
            return Center(child: Text("Please wait"));
          }
        },

这是我尝试添加动画的方式:

CircularProgressIndicator()

这很好用,但是当我尝试用动画替换简单的 Text("Please wait") 时,我得到了奇怪的结果。我根本得不到未来的结果,有时只有几个结果。有时数据似乎根本没有到达,因为snapshot.data 有时会打印null,有时所有结果都在那里。我看不到动画和构建器之间的任何连贯性。

解决方法

试试这个:

Future<Tour> _tour;
  
  getTours() async {
    return await _tourService.getTourDataPerEmployee(employeeID: userinfo.user.uid);

  }

  @override
  void initState() {
    super.initState();
    _tour = getTours();
  }

然后在小部件中:

FutureBuilder(
        future: _tour,builder: (context,snapshot) {
          if (snapshot.hasData) {
            print(snapshot.data.waypoints);
            return Container(
                child: ListView.builder(
              itemCount: snapshot.data.waypoints.length,itemBuilder: (context,index) {
                return TimelineTile(
                  nodePosition: 0.03,contents: TourTile(
                    tour: snapshot.data,index: index,),node: TimelineNode(
                    indicator: CustomIndicator(
                        finished: snapshot.data.waypoints[index].finished),startConnector: CustomConnector(
                        finished: snapshot.data.waypoints[index].finished,inProgress: false),endConnector: CustomConnector(
                        finished: snapshot.data.waypoints[index].finished,inProgress: index >= snapshot.data.waypoints.length - 1
                            ? true
                            : snapshot.data.waypoints[index + 1].finished
                                ? false
                                : true),);
              },));
          } else {
            return CircularProgressIndicator();
          }
        },

你甚至可以在未来调用 getTours()

FutureBuilder(
        future: getTours(),

相关问答

错误1:Request method ‘DELETE‘ not supported 错误还原:...
错误1:启动docker镜像时报错:Error response from daemon:...
错误1:private field ‘xxx‘ is never assigned 按Alt...
报错如下,通过源不能下载,最后警告pip需升级版本 Requirem...