Search code examples
reactjsreact-nativescrollviewreact-native-scrollview

You specified `onScroll` on a <ScrollView> but not `scrollEventThrottle`


I am using Scrollview of react-native in my code.

<ScrollView style={styles.productlist} >
         <CarouselComponent images={images}/>
</ScrollView>

Its working fine on an app, with no error, and no warning but in Console I am getting the below message repeatedly:

You specified onScroll on a but not scrollEventThrottle. You will only receive one event. Using 16 you get all the events but be aware that it may cause frame drops, use a bigger number if you don't need as much precision.

Don't know what is missing, I have not passed onScroll props but still getting this message. Any suggestion...

My Carousel component Code is:

const renderImages = (image, index) => {
  return (
    <Image
      key={index}
      style={styles.carouselImage} 
      source={{ uri: image.large }} 
    />
  );
}
const CarouselComponent = (props) => {
  const { images: { alternate = [] } = {} } = props;
  if (alternate.length > 0) {
    return (
      <Carousel
        delay={3000}
        autoplay
        style={styles.carouselLayout}
        bullets
        chosenBulletStyle={globalStyle.proDetCarSelectBullet}
        bulletStyle={globalStyle.productDetailBullet}
        bulletsContainerStyle={globalStyle.proDetCarBullet}              
        isLooped
        currentPage={0}
      >
        {alternate.map((image, index) => renderImages(image, index))}          
      </Carousel>
    );
  }

  return null;
}

Solution

  • You are probably using an older version of react-native-looped-carousel. On github there is a issue, which was fixed 27 days ago, describing your problem.

    Fix:

    Updating to the latest version of react-native-looped-carousel should resolve your issue. As an alternative you can fix the error by manually adding the scrollEventThrottle. See here.