构建ListView时如何在itemBuilder内部传递数据？

Question

如何在

data

函数内传递

buildListItem

作为参数？

当我向

data

添加第三个参数

buildListItem

时，IDE 中会出现错误：

参数类型“Widget”不能分配给参数类型 '小部件？函数（BuildContext，int）'。

final List<RapportData> data = snapshot.data!;

return ListView.separated(
  physics: const ScrollPhysics(),
  itemCount: data.length,
  itemBuilder: buildListItem, // how to pass `data`?
  separatorBuilder: (context, index) => const Divider(),
);

Widget buildListItem(BuildContext context, int index) {
  return GestureDetector(
    onTap: () {
      var rapportData = data[index]; //data is not avalable here
      onTapFunction(context, Group(rapportData));
    },
    child: ListTile(...
    
    ... 
}

Answer 1

你可以尝试这样传递参数：

final List<RapportData> data = snapshot.data!;

return ListView.separated(
  physics: const ScrollPhysics(),
  itemCount: data.length,
  itemBuilder: (context, index) => buildListItem(context, data[index]),
  separatorBuilder: (context, index) => const Divider(),
);

Widget buildListItem(BuildContext context, RapportData rapportData) {
  return GestureDetector(
    onTap: () {
      //rapportData can use here
      onTapFunction(context, Group(rapportData));
    },
    child: ListTile(...
    
    ... 
}

Answer 2

当然！您可以通过直接在

itemBuilder

参数内使用匿名函数来实现此目的。方法如下：

final List<RapportData> data = snapshot.data!;

return ListView.separated(
  physics: const ScrollPhysics(),
  itemCount: data.length,
  itemBuilder: (context, index) {
    var rapportData = data[index];
    return GestureDetector(
      onTap: () {
        onTapFunction(context, Group(rapportData));
      },
      child: ListTile(
        // ListTile properties...
      ),
    );
  },
  separatorBuilder: (context, index) => const Divider(),
);

这样，您可以直接在

itemBuilder

参数内创建一个匿名函数，从而允许您访问其中的

data

列表。