Flutter中ListView.builder点击卡片无法获取id问题求助

核心错误1：错误访问模型数据 #

你在StreamBuilder的map操作中已经将Firestore文档转换成了OutletModel对象，但在onTap回调里仍用Map的方式snaps.data[index]['id']访问属性——这必然返回null，因为snaps.data[index]是类实例而非Map，必须通过模型的属性方法访问。

核心错误2：全局selected变量导致状态混乱 #

使用单个全局selected变量时，ListView中所有卡片的选中状态会同步变化，无法实现单张卡片独立选中的预期效果。

修复步骤： #

1. 修正模型属性访问方式
   将所有snaps.data[index]['xxx']的Map式访问替换为模型属性访问：

// 错误写法
// outletId = snaps.data[index]['id'];
// 正确写法
outletId = snaps.data[index].id;
widget.orderModel.shopId = snaps.data[index].id;
outletName = snaps.data[index].outletName;
emailS = snaps.data[index].email;
phoneN = snaps.data[index].phoneNumber;

2. 替换全局选中状态为列表式管理
   在页面的State类中定义列表，单独维护每张卡片的选中状态：

// State类内添加
List<bool> selectedStates = [];

然后在StreamBuilder获取数据后初始化该列表：

if (!snaps.hasData) {
  return Center(child: Text(Languages.of(_)!.noData));
} else {
  // 初始化选中状态列表，默认全未选中
  if (selectedStates.length != snaps.data.length) {
    selectedStates = List.generate(snaps.data.length, (_) => false);
  }
  return ListView.builder(
    physics: const ScrollPhysics(),
    scrollDirection: Axis.vertical,
    shrinkWrap: true,
    itemCount: snaps.data.length,
    itemBuilder: (BuildContext context, int index) {
      return InkWell(
        onTap: () async {
          setState(() {
            selectedStates[index] = !selectedStates[index];
            if (selectedStates[index]) {
              outletId = snaps.data[index].id;
              widget.orderModel.shopId = snaps.data[index].id;
              outletName = snaps.data[index].outletName;
              emailS = snaps.data[index].email;
              phoneN = snaps.data[index].phoneNumber;
              widget.orderModel.customerPet = widget.petModel.id;

              debugPrint('the shopId is =======> ${snaps.data[index].id}');
            }
          });
        },
        child: selectedStates[index] ? 
          Stack(
            children: [
              OutletCard(outletModel: snaps.data[index]),
              const Positioned(
                right: 0,
                top: 0,
                child: Icon(
                  Icons.check_circle_outline, color: Colors.green,
                  size: 50)
              ),
            ],
          ) : OutletCard(outletModel: snaps.data[index]),
      );     
    }
  );
}

3. 可选：避免内层InkWell干扰
   虽然OutletCard中的InkWell仅绑定了onDoubleTap，理论上不会拦截onTap事件，但如果仍有点击无响应的情况，可以移除OutletCard内的InkWell，或通过回调将点击逻辑移至子组件。

效果验证 #

修改完成后，点击卡片将正确获取outletId并输出控制台日志，同时每张卡片的选中状态会独立切换，不再出现全局同步的问题。

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