Flutter - 同时请求多个 API 的最佳方式

Gbe*_*a A 3 future dart flutter

我有两个 URL,我正在使用该fetchData()函数来解析 json。

Future<Iterable> fetchData() async {
var response = await http.get(firstUrl);
var listOne = List<Article>();

if (response.statusCode == 200) {
  var notesJson = json.decode(response.body);
  var bodyList = notesJson['items'];
  for (var i in bodyList) {
    listOne.add(Article.fromJson(i));
  }
}
var resp = await http.get(secondUrl);
var listTwo = List<Article>();
if (resp.statusCode == 200) {
  var notesJson = json.decode(resp.body);
  var bodyList = notesJson['items'];
  for (var i in bodyList) {
    listTwo.add(Article.fromJson(i));
  }
}

var newL = [...listOne, ...listTwo];
return newL;
}
Run Code Online (Sandbox Code Playgroud)

我觉得这是多余的。我想知道这是否是正确的方法,或者我可以优化它吗?由于我正在查询两个 URL,我应该使用它compute()吗?

Mar*_*cel 5

Fluttercompute产生了另一个Isolate(Dart 中类似线程的东西),这对于等待网络请求来说非常耗费资源。很高兴,Dart 是基于事件循环的,因此您可以通过简单地将两个网络请求包装Future在对 的调用中来同时等待两个请求Future.wait。有关 Dart 事件循环的更多信息,您可能需要查看Flutter 的 YouTube 频道上有关 Futures说明视频

Future<List<Article>> fetchData() async {
  var responses = await Future.wait([
    http.get(firstUrl),
    http.get(secondUrl),
  ]);
  return <Article>[
    ..._getArticlesFromResponse(responses[0]),
    ..._getArticlesFromResponse(responses[1]),
  ];
}

List<Article> _getArticlesFromResponse(http.Response response) {
  return [
    if (response.statusCode == 200)
      for (var i in json.decode(response.body)['items'])
        Article.fromJson(i),
  ];
}
Run Code Online (Sandbox Code Playgroud)