时间戳

首页 > 解决方案 > Flutter：如何在构建方法之前在小部件上发出一系列 http 请求

flutter - Flutter：如何在构建方法之前在小部件上发出一系列 http 请求

问题描述

我有 3 个类：用户、帖子和评论。用户有很多帖子， 帖子有很多评论。

我希望在调用小部件的构建方法之前获取所有数据。

我尝试使用initState()来做到这一点：

class FetchDataExample extends StatefulWidget {
  final User _user;

  FetchDataExample(this._user);

  @override
  _State createState() => _State(_user);
}

class _State extends State<FetchDataExample> {
  final User _user;

  _State(this._user);

  @override
  void initState() {
    _user.setPosts();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    print(this._user.posts[0]);


    return Container(

    );
  }
}

在用户类 中，我有：

void setPosts() async {

    String url = 'https://jsonplaceholder.typicode.com/posts?userId=' + this.id.toString();
    var request = Requester.get(url); // Returns a Future<Response>

    await request.then((value) => this.posts = Post.jsonToPosts(json.decode(value.body)));

    this.posts.forEach((post) => post.setComments());

    print(this.posts[0]);
}

'setComments()' 具有相同的逻辑。

我有两个打印件：

  1. 返回null的内部构建；
  2. 在setPosts中返回'Post' 的实例；

因此，当在小部件中调用 Build 方法时，initState 尚未完成。

我需要完成它，有人知道我该怎么做吗？

标签： flutterdart

解决方案

您可以使用FutureBuilder未来的最新结果来构建小部件。您还可以使用方法将多个期货组合成一个Future.wait。

这是一个示例代码：

_getPageData() async {
  var _combinedFutures =  await Future.wait([setPosts, setComments]);
  //do stuff with data
}
...
@override
  Widget build(BuildContext context) {
    return FutureBuilder(
         future:_getPageData(),
         builder: (context, snapshot) {
            return Container();
         }),
    );

  });

推荐阅读