list - 如何在 flutter 中渲染列表中的列表？

Question

我正在创建一个 flutter 应用程序，它应该显示团队列表，每个团队都是一个包含如下项目的对象

name : 字符串

players : 数组

name : 字符串

看起来像这样

List teams = [
      {
        'name': 'Team one',
        'players': [
          {
            'name': 'Team one player one',
          },
          {
            'name': 'Team one player two',
          },
          {
            'name': 'Team one player three',
          },
        ]
      },
      {
        'name': 'Team two',
        'players': [
          {
            'name': 'Team two player one',
          },
          {
            'name': 'Team two player one',
          },
          {
            'name': 'Team two player three',
          },
        ]
      },
    ];

此外，在我的代码中，我正在遍历所有 teams与 ListView , 像这样

  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: renderTeams(teams),
      ),
    );
  }

和renderTeams()看起来像这样:

  Widget renderTeams(List teams) {
    return ListView.builder(
      itemCount: teams.length,
      itemBuilder: (context, index) {
        return Padding(
          padding: EdgeInsets.all(10.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(teams[index]['name']),
              Row(
                children: <Widget>[
                  Flexible(
                    child: PlayerCard(
                      player: teams[index]['players'][0],
                    ),
                  ),
                  Flexible(
                    child: PlayerCard(
                      player: teams[index]['players'][1],
                    ),
                  ),
                  Flexible(
                    child: PlayerCard(
                      player: teams[index]['players'][2],
                    ),
                  ),
                ],
              )
            ],
          ),
        );
      },
    );
  }

这很好用，一切都相应地呈现。

但是，我想，而不是分别添加每个球员，遍历每个球队的球员，所以我的 renderTeams()看起来像这样:

  Widget renderTeams(List teams) {
    return ListView.builder(
      itemCount: teams.length,
      itemBuilder: (context, index) {
        return Padding(
          padding: EdgeInsets.all(10.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(teams[index]['name']),
              renderPlayers(teams[index]['players'])
            ],
          ),
        );
      },
    );
  }

和renderPlayers()看起来像这样:

  renderPlayers(players) {
    return Row(children: players.map((player) => {
        Flexible(
          child: PlayerCard(
            player: player,
          ),
      )
    }).toList());
  }

这就是我的麻烦开始的地方，因为我遇到了类似

的错误

type 'List<dynamic>' is not a subtype of type 'List<Widget>'

我四处搜索，但其他回复试图修复类型，但这导致我陷入无限循环，试图修复我不理解的错误。

有人得到任何提示吗？提前致谢

Answer 1

删除 { }

renderPlayers(players) {
  return Row(children: players.map((player) => 
      Flexible(
        child: PlayerCard(
          player: player,
      ),
    )
  ).toList());
}

解释

=>表示 return . => { ... }意味着返回一个函数(动态)。这就是为什么它被检测为 List<dynamic> 的原因