如何在颤振中解决“RangeError(索引):无效值:有效值范围为空:0”?

Shr*_*rma 0 error-handling dart firebase flutter google-cloud-firestore

在此处输入图片说明

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

已声明的全局变量:

 List<String> getSliderImages=[];
Run Code Online (Sandbox Code Playgroud)

从 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"); 
      });
    });
  }
Run Code Online (Sandbox Code Playgroud)

滑块小部件,我想在那里显示图像:

这里我使用了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,
             )
            ),

Run Code Online (Sandbox Code Playgroud)

Shr*_*rma 7

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

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

这里修改代码:

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,
             )
            ),  
Run Code Online (Sandbox Code Playgroud)