wordpress - Flutter如何在一个屏幕上调用多个api(使用futurebuilders)？

Question

我正在使用rest api 并使用http 库构建一个主页。我可以从我的 api 调用中获取最新帖子。但我正在构建一个主页，所以我必须显示来 self 的其余 api 的更多数据。 使用 WordPress 作为后端。我想从 3-4 个类别中获取 5 个帖子，以使主页充满内容。

这是我的代码:

class HomePage extends StatelessWidget {
  static const routeName = 'homepage';

  final WpPostService wpPostService = WpPostService();

  // final WpGhazalService wpGhazalService = WpGhazalService();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: Text('welcome to LilwaQamar'),
      ),
      body: Container(
        child: Column(
          children: [
            Container(
              child: FutureBuilder(
                  future: wpPostService.getPosts(),
                  builder: (BuildContext context,
                      AsyncSnapshot<List<Post>> snapshot) {
                    if (snapshot.hasData) {
                      List<Post> posts = snapshot.data;
                      return ListView(
                        children: posts
                            .map((Post post) => Card(
                                  elevation: 6,
                                  margin: EdgeInsets.all(10.0),
                                  child: ListTile(
                                    title: Html(
                                      data: post.title.rendered,
                                      defaultTextStyle: GoogleFonts.lato(
                                        textStyle: TextStyle(
                                            color: Colors.black,
                                            letterSpacing: .5,
                                            fontSize: 19),
                                      ),
                                    ),
                                    subtitle: Html(
                                      data: post.content.rendered
                                              .substring(0, 73) +
                                          '..',
                                      defaultTextStyle: GoogleFonts.lato(
                                        textStyle: TextStyle(
                                            color: Colors.black54,
                                            letterSpacing: .5,
                                            fontSize: 16),
                                      ),
                                    ),
                                    onTap: () {
                                      Navigator.push(
                                        context,
                                        MaterialPageRoute(
                                          builder: (context) => PostDetaislPage(
                                            post: post,
                                          ),
                                        ),
                                      );
                                    },
                                  ),
                                ))
                            .toList(),
                      );
                    }
                    return Center(child: CircularProgressIndicator());
                  }),
            ),
            Container(
              child: Text("Ghazals"),
            ),
          ],
        ),
      ),
    );
  }
}

我可以从最新的帖子中获取数据。但我还有一些 api 调用，例如来自类别/1、类别/2 等的帖子。如何从多个类别获取帖子？或者如何在一个屏幕上调用多个 futurebuilder？我希望你能明白我的问题。

Answer 1

<强> Check out the video for multiple API calls

 fetchData() async {
  var responses = await Future.wait([
    http.get(firstAPI), // make sure return type of these functions as Future.
    http.get(secondAPI),
  ]);
 var response1 = responses.first;
 var response2 =  responses[1];
}