firebase - 如何在 flutter 中解决 "RangeError (index): Invalid value : Valid value range is empty : 0"？

Question

我试图从 firestore 数据库中获取图像并将其放入字符串类型列表并希望显示为 slider 图像。
但上述错误发生在屏幕上，但毫秒后，错误消失，图像显示为 slider

清除全局变量:

 List<String> getSliderImages=[];

从 Firestore 获取图像的方法:

这个方法在 initState() 内部调用方法

 void getSliderImage(){
   List<String> userId=[];
    Firestore.instance.collection("Slider").getDocuments()
    .then((QuerySnapshot snapshot) {
      snapshot.documents.forEach((f){
        setState(() {
         userId.add(f.documentID);  
        });
      });


      for(int i=0;i<userId.length;i++){
        setState(() {
         print('snap.documentID_IF_userId :${userId[i]}');
         Firestore.instance.collection('Slider').document(userId[i]).get().then((DocumentSnapshot document){
          String image=document['Image'];
          getSliderImages.add(image); 
          print('snap.documentID_IF_userId_IMAGE :$image');
          print("getSliderImages:$getSliderImages");
         });
        });
      } 
    }).catchError((onError){
      print(onError); 
      setState(() {
      Fluttertoast.showToast(msg: "$onError"); 
      });
    });
  }

slider 小部件，我要显示图像:

这里我用了 carousel_pro slider 插件

Container(
                padding: const EdgeInsets.all(10.0),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(30.0)),
                //color: Colors.black
              ),
              height: MediaQuery.of(context).size.height/5,
              width: MediaQuery.of(context).size.height/2,
              child: Carousel(
                images: [
                   new NetworkImage(getSliderImages[0]),
                   new NetworkImage(getSliderImages[1]),
                   new NetworkImage(getSliderImages[2]),
                   new NetworkImage(getSliderImages[3]),

                  ],//getSliderUserId
                showIndicator: true,
                borderRadius: true,

                moveIndicatorFromBottom: 100.0,
               noRadiusForIndicator: false,
                overlayShadow: false,
               overlayShadowColors: Colors.white,
                overlayShadowSize: 0.7,
             )
            ),

Answer 1

我自己解决了
发生此错误是因为 getSliderUserId[]最初是空的。
所以，我在小部件上设置了一个条件。如果 getSliderImages.isEmpty然后显示进度指示器，否则显示 slider 图像。

现在它可以完美运行而不会出现索引错误:)

这里修改代码:

Container(
                padding: const EdgeInsets.all(10.0),
                decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(30.0)),
                //color: Colors.black
              ),
              height: MediaQuery.of(context).size.height/5,
              width: MediaQuery.of(context).size.height/2,
              child:  getSliderImages.isEmpty? 
              CircularProgressIndicator()
               :
              Carousel(
                images: [
                   new NetworkImage(getSliderImages[0]),
                   new NetworkImage(getSliderImages[1]),
                   new NetworkImage(getSliderImages[2]),
                   new NetworkImage(getSliderImages[3]),
                  ],
               showIndicator: true,
               borderRadius: true,
               moveIndicatorFromBottom: 100.0,
               noRadiusForIndicator: false,
               overlayShadow: false,
               overlayShadowColors: Colors.transparent,
               overlayShadowSize: 0.7,
             )
            ),