scrollToIndex out of range in react-native-flatlist-slider

Question

Hy! I'm using a react-native-flatslider for static images it's working fine but for images getting for apis is not work properly. It displays me

Invariant Violation: scrollToIndex out of range: item length 0 but minimum is 1

So I search it but not getting something which help me to solve.

CODE

const Preview = ({
    item,
    onPress,
    index,
  }) => {
      
    return(
        <TouchableOpacity
      style={[styles.videoContainer,{
          // marginLeft:index == 0 ? wp('2'): 0,
      }]}
     >
      <View style={[styles.imageContainer, styles.shadow]}>
        <Image
          style={{height:hp('22'), width:wp('90'), borderRadius:10,}}
          source={item.banner}
        />
      </View>
     
    </TouchableOpacity>
    )
}

const SliderCarouselFlat = () => {
  const [banners, setBanners] = useState([])
  const [index, setIndex] = useState(0)
  const slider = useRef()


  useEffect(()=>{
    getBanners()
  },[])


  // API CALL
  const getBanners =async () =>{
    try{
      const {data} =await getBannersApi()
      setBanners(data)
    }catch(e){
      console.log(e)
    }
  }

  return (
    <View style={styles.container}>
     <View>
      <FlatListSlider
        data={images}
        height={200}
        timer={2000}
        keyExtractor={item => item.key.toString()}
        onPress={item => alert(JSON.stringify(item))}
        component={<Preview/>}
        indicatorContainerStyle={{position:'absolute', bottom: 20}}
        indicatorActiveColor={'#ffffff'}
        indicatorInActiveColor={'#ffffff80'}
        loop={false}
        animation
      />
      </View> 
    </View>
  );
};

Can someone guide what I'm missing or how to solve that?