firebase - 如何解决它在Flutter中出现“ RangeError（索引）：无效值：有效值范围为空：0”？(How to resolve it “RangeError (index): Invalid value : Valid value range is empty : 0” in flutter?)

Question

I'm to trying to get images from firestore database and put onto String type list and want to show as the slider Image.

(我要尝试从Firestore数据库获取图像并将其放到“字符串类型”列表中，并希望显示为滑块图像。)

but the above error is occurring on Screen but after milliseconds, error goes and images show as slider

(但是上述错误发生在屏幕上，但是在毫秒后，错误消失了，图像显示为滑块)

Decleared Global Varible:

(已清除的全局变量：)

 List<String> getSliderImages=[];

Method for fetched images from firestore:

(从消防站中获取图像的方法：)

And this method is calling inside initState() method

(而且此方法在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 widget, there I want to display images:

(滑块小部件，我要在其中显示图像：)

Here I used carousel_pro plugin for Slider

(在这里我使用了carousel_pro滑块)

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,
             )
            ),

  ask by Shruti Ramnandan Sharma translate from so

Answer 1

I have solved it by myself, this error was occurring because of getSliderUserId[] was empty at initially.

(我自己解决了这个错误，是因为最初getSliderUserId[]为空。)

so, I put a condition on the widget.

(因此，我在小部件上设置了条件。)

if getSliderImages.isEmpty then show progress indicator otherwise Display Slider Image.

(如果getSliderImages.isEmpty然后显示进度指示器，否则显示滑块图像。)

Now it's working perfectly without getting indexing error :)

(现在它可以完美工作而不会出现索引错误:))

Here Modified code:

(这里修改代码：)

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,
             )
            ),