在 null 上调用了方法 'contains'

The method 'contains' was called on null

大家好,这是我的代码:我正在尝试显示我的预订应用程序的可用时间段。

   Expanded(
      child: FutureBuilder(
        future: getTimeSlotOfCourt(
          courtModel,
          DateFormat('dd_MM_yyyy').format(context.read(selectedDate).state),
        ),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.waiting) {
            return Center(
              child: CircularProgressIndicator(),
            );
          } else {
            var listTimeSlot = snapshot.data as List<int>;
            return GridView.builder(
                itemCount: TIME_SLOT.length,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 3),
                itemBuilder: (context, index) => GestureDetector(
                      onTap: listTimeSlot.contains(index)
                          ? null
                          : () {
                              context.read(selectedTime).state =
                                  TIME_SLOT.elementAt(index);
                              context.read(selectedTimeSlot).state = index;
                            },
                      child: Card(
                        color: listTimeSlot.contains(index)
                            ? Colors.white10
                            : context.read(selectedTime).state ==
                                    TIME_SLOT.elementAt(index)
                                ? Colors.white54
                                : Colors.white,
                        child: GridTile(
                          child: Center(
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.center,
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Text('${TIME_SLOT.elementAt(index)}'),
                                Text(listTimeSlot.contains(index)
                                    ? 'Full'
                                    : 'Available')
                              ],
                            ),
                          ),
                          header: context.read(selectedTime).state ==
                                  TIME_SLOT.elementAt(index)
                              ? Icon(Icons.check)
                              : null,
                        ),
                      ),
                    ));
          }
        },
      ),
    )
  ],
);

}

我收到此错误消息,指出方法 'contains' 被调用为 null。

Future<List<int>> getTimeSlotOfCourt(CourtModel courtModel, String date) async {
List<int> result = new List<int>.empty(growable: true);
  // var ref = CourtModel().refer;
  // var bookingRef = ref.collection(date);
  var bookingRef = CourtModel().reference.collection(date);
  QuerySnapshot snapshot = await bookingRef.get();
  snapshot.docs.forEach((element) {
    result.add(int.parse(element.id));
  });
  return result;
}

这是我用过的功能

请帮助我理解为什么我会收到此错误,该错误显示方法 'contains' 在 null 上被调用。

快照并不总是包含数据。 Future builder 在 future 完成之前构建一次。空检查 snapshot.data 和 return 微调器或其他东西来解决这个问题

future builder只在future完成时才带来数据,快照可能不会一直包含数据。而你只是检查等待状态,更好的解决方案是检查快照是否有数据。

类似这样的解决方案是首选。

FutureBuilder(
    future: _getTimeSlotOfCourt(),
    builder:(context, AsyncSnapshot snapshot) {
        if (!snapshot.hasData) {
            return Center(child: CircularProgressIndicator());
         } else {
                 // place you code here  
         }
     }
)