Flutter 颤振如何通过for循环显示列表

我创建了一个简单的列表，通过for循环来显示它

List categories = [
  {
    {
      'CatID': '0',
      'CatName': 'All'
    },
    {
      'CatID': '1',
      'CatName': 'Computer Hardware'
    },
    {
      'CatID': '2',
      'CatName': 'Computer Software'
    },
  }
];

然后我定义了这样一个小部件

List<Widget> CatWidget = List<Widget>(); 

for (int i = 0; i < 8; i++) {
  CatWidget.add(
    Container(
      child: Text(categories[i]['CatName']),
    ),
  );
}

List-CatWidget=List（）；

然后我就这样用

List<Widget> CatWidget = List<Widget>(); 

for (int i = 0; i < 8; i++) {
  CatWidget.add(
    Container(
      child: Text(categories[i]['CatName']),
    ),
  );
}

for（int i=0；i<8；i++）{
CatWidget.add(
容器(
子：文本（类别[i]['CatName']），
),
);
}

---

其显示错误

类“\u CompactLinkedHashSet”没有实例方法“[]”。

您可以使用list.generate在列表中循环并返回小部件

 Column(
            children: List.generate(
              tags.length,
              (index) => Container(
                // margin: EdgeInsets.symmetric(),
                child: NativeButton(
                  borderRadius: BorderRadius.circular(4),
                  padding: EdgeInsets.symmetric(
                    vertical: sizeConfig.height(.01),
                    horizontal: sizeConfig.width(.02),
                  ),
                  color: Colors.grey[200],
                  child: Text(tags[index]),
                ),
              ),
            ),
          ),

---

您的列表包含太多大括号：

List categories = [
    {
      'CatID': '0',
      'CatName': 'All'
    },
    {
      'CatID': '1',
      'CatName': 'Computer Hardware'
    },
    {
      'CatID': '2',
      'CatName': 'Computer Software'
    },
  ];

你的循环应该运行到3而不是8，因为你没有8

因此，以下方法可行，但是，我鼓励您检查另一个答案，以获得更好的方法：

import 'package:flutter/material.dart';

void main() {

    List categories = [
  
    {
      'CatID': '0',
      'CatName': 'All'
    },
    {
      'CatID': '1',
      'CatName': 'Computer Hardware'
    },
    {
      'CatID': '2',
      'CatName': 'Computer Software'
    },
  ];

final catWidget = List<Widget>(); 

for (int i = 0; i < 3; i++) {
  catWidget.add(
    Container(
      child: Text(categories[i]['CatName']),
    ),
  );
}

  runApp(MyApp(catWidget));
}

class MyApp extends StatelessWidget {
  final List<Widget> children;
  
  const MyApp(this.children);
  
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(children: children),
        ),
     );
  }
}

导入“包装：颤振/材料.省道”；
void main（）{
列表类别=[
{
“CatID”：“0”，
“猫名”：“全部”
},
{
“CatID”：“1”，
“CatName”：“计算机硬件”
},
{
“CatID”：“2”，
“CatName”：“计算机软件”
},
];
final catWidget=List（）；
对于（int i=0；i<3；i++）{
catWidget.add(
容器(
子：文本（类别[i]['CatName']），
),
);
}
runApp（MyApp（catWidget））；
}
类MyApp扩展了无状态小部件{
最后儿童名单；
const MyApp（this.children）；
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
正文：列（子项：子项），
),
);
}
}

您有一个JSON数组，在JSON数组中，您有一个JSON对象，在该JSON对象中，您有多个JSON对象，您希望逐个迭代，这是不合适的

JSON数组>JSON对象True

JSON数组>JSON数组>JSON对象True

JSON数组>JSON对象>JSON对象False

For循环只能在数组或对象列表上工作，json应该如下所示：

  [
    {
      'CatID': '0',
      'CatName': 'All'
    },
    {
      'CatID': '1',
      'CatName': 'Computer Hardware'
    },
    {
      'CatID': '2',
      'CatName': 'Computer Software'
    },
  ]

---

干得好祝贺铜牌飘动@彼得·哈达德：谢谢。请你也看看这个问题好吗