Flutter - 在 Listview 中调用 api

Flutter - make api call inside Listview

我正在调用 api,它将 return 项目列表(锻炼),项目将显示在 ListView 中。但我还需要为 ListView 的每个项目调用另一个 api 以获取该锻炼的分数(如果已经有分数)并根据每个锻炼的 id 显示分数。我该如何解决这种情况。?我正在使用 bloc,这就是我获取锻炼的方式

Future<void> _onLoadingWod(
      OnLoadingWodEvent event, Emitter<WhiteboardState> emit) async {
    emit(state.copyWith(isWodLoading: true));
    final listWods =
        await WhiteboardService().getListWod(state.selectedDay.toString());

    emit(state.copyWith(
        isWodLoading: false, listWods: listWods));
  } 

有些锻炼可能还没有分数,在这种情况下,我会在列表视图中显示一个按钮来记录每次锻炼的分数。

我试过这样的事情:

    final listResults = await Stream.fromIterable(listWods)
        .asyncMap((wod) => WhiteboardService().getresult(wod.id))
        .toList();

但由于某些锻炼可能没有结果,因此显示错误。

link 锻炼结果如何显示在列表视图中?请提供任何帮助或指导。

据我了解,它可以通过循环完成。您必须为包含锻炼 ID 的结果创建一个模型 class。然后你可以遍历它并从锻炼列表中找到相关的锻炼,然后为其分配结果。

有个例子希望对你有帮助。

*虚拟模型 classes

class Workouts {
  final int id;
  Result? result;

  Workouts({
    required this.id,
    this.result,
  });
}

class Result {
  final int workoutId;
  final String result;

  Result({
    required this.workoutId,
    required this.result,
  });
}

*将结果分配给锻炼列表

void asignResults() {
    ///for each [results]
    for (Result result in listResults) {
      listWorkouts
          .firstWhere((workout) => workout.id == result.workoutId)
          .result = result;
    }
    listWorkouts.forEach((element) {
      print(element.toString());
    });
  }

我认为如果您可以从后端执行此操作,将会比这种方法更有效。 (例如:- 在 sql 中加入查询)