Flutter中如何循环函数内指定代码块？请修复我的循环代码

你的问题出在没有正确将循环生成的Widget集合加入到Column的children列表中。直接在children数组里写for循环语句不会自动把循环内的Widget添加到列表，需要将循环转换成List<Widget>并通过展开运算符插入到children中。

修复后的完整代码 #

_buildContentView({BuildContext context}) {
  return Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      _buildMenuItemImage(),
      Container(
        child: Text(widget.menuItem.name,
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
        padding: EdgeInsets.only(left: 16, right: 16, top: 12, bottom: 8),
      ),
      Container(
        child: Text(widget.menuItem.itemDescription,
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.normal)),
        padding: EdgeInsets.only(left: 16, right: 16, top: 12, bottom: 8),
      ),
      // 循环生成每个category对应的Row和菜单视图
      ...widget.menuItem.category.map((category) => Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  Container(
                    child: Text('Select ' + category),
                    padding: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 6),
                  ),
                  Container(
                    child: Text('Select ' +
                        _qty.toString() +
                        ' item (' +
                        _qty.toString() +
                        '/' +
                        widget.menuItem.setMenuItems.length.toString() +
                        ')'),
                    padding: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 6),
                  ),
                ],
              ),
              _buildSetMenusView(setMenuItems: widget.menuItem.setMenuItems),
            ],
          )).toList(),
      Padding(
        padding: EdgeInsets.only(left: 12, right: 12, top: 8, bottom: 12),
        child: _buildActionButtons(context: context),
      )
    ],
  );
}

关键修复点 #

1. 使用map遍历category列表：通过widget.menuItem.category.map((category) => ...)遍历每个分类，对每个分类生成对应的Widget组合。
2. 用Column包裹循环内的两个Widget：因为每次循环需要生成Row和_buildSetMenusView两个Widget，所以用Column把它们包裹成一个单独的Widget，避免列表中出现零散的元素。
3. 展开运算符...：将map生成的List<Widget>展开后插入到Column的children列表中，这样Flutter才能正确识别并渲染所有循环生成的内容。
4. 替换硬编码的索引：把原来的widget.menuItem.category[0]改成遍历的category变量，确保每个循环项对应正确的分类名称。

另一种写法（用for循环） #

如果你更习惯用for循环，也可以这样写：

_buildContentView({BuildContext context}) {
  // 先创建一个空列表存储循环生成的Widget
  List<Widget> categoryWidgets = [];
  for(var i = 0; i < widget.menuItem.category.length; i++){
    categoryWidgets.addAll([
      Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          Container(
            child: Text('Select ' + widget.menuItem.category[i]),
            padding: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 6),
          ),
          Container(
            child: Text('Select ' +
                _qty.toString() +
                ' item (' +
                _qty.toString() +
                '/' +
                widget.menuItem.setMenuItems.length.toString() +
                ')'),
            padding: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 6),
          ),
        ],
      ),
      _buildSetMenusView(setMenuItems: widget.menuItem.setMenuItems),
    ]);
  }

  return Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      _buildMenuItemImage(),
      Container(
        child: Text(widget.menuItem.name,
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
        padding: EdgeInsets.only(left: 16, right: 16, top: 12, bottom: 8),
      ),
      Container(
        child: Text(widget.menuItem.itemDescription,
            style: TextStyle(fontSize: 18, fontWeight: FontWeight.normal)),
        padding: EdgeInsets.only(left: 16, right: 16, top: 12, bottom: 8),
      ),
      // 把循环生成的Widget列表加入到children中
      ...categoryWidgets,
      Padding(
        padding: EdgeInsets.only(left: 12, right: 12, top: 8, bottom: 12),
        child: _buildActionButtons(context: context),
      )
    ],
  );
}

内容的提问来源于stack exchange，提问作者suns