'Can't stop react multi carousel autoplay [closed]

I am using the 'react-multi-carousel' module to show multiple items. All is going well, but it runs automatically. I don't want it to autoplay.

I have set props "autoPlay" to "false" as follows. But the carousel focus goes from the first slide to the last slide. What is important is that this problem is happening when I click the arrow (next) button first.

My code:


    <Carousel
      additionalTransfrom={0}
      arrows
      autoPlay={false}
      autoPlaySpeed={3000}
      centerMode={false}
      className=""
      containerClass="container-with-dots"
      dotListClass=""
      draggable
      focusOnSelect={false}
      infinite
      itemClass=""
      keyBoardControl
      minimumTouchDrag={80}
      renderButtonGroupOutside={false}
      renderDotsOutside={false}
      responsive={{
        desktop: {
          breakpoint: {
            max: 3000,
            min: 1024
          },
          items: 3,
          partialVisibilityGutter: 40
        },
        mobile: {
          breakpoint: {
            max: 464,
            min: 0
          },
          items: 1,
          partialVisibilityGutter: 30
        },
        tablet: {
          breakpoint: {
            max: 1024,
            min: 464
          },
          items: 2,
          partialVisibilityGutter: 30
        }
      }}
      showDots={false}
      sliderClass=""
      slidesToSlide={1}
      swipeable
    >
                <div className='carousel-item-padding-40-px' style={{backgroundColor: 'blue', padding: '30px'}}>Item 1</div>
                <div className='carousel-item-padding-40-px' style={{backgroundColor: 'blue', padding: '30px'}}>Item 2</div>
                <div className='carousel-item-padding-40-px' style={{backgroundColor: 'blue', padding: '30px'}}>Item 3</div>
                <div className='carousel-item-padding-40-px' style={{backgroundColor: 'blue', padding: '30px'}}>Item 4</div>
              </Carousel>
autoplayreact-multi-carousel


Solution 1:[1]

I followed your answers but there is no any change. I upgraded my 'react-multi-carousel' module. If so, It run very well. Thanks.

Solution 2:[2]

set shouldResetAutoplay={false}

Solution 3:[3]

I got same issue, also have set autoPlay={false}.

it's won play at first,but once I click the arrow then it will auto move til the last one.(I didn't set infinite)

I set autoPlaySpeed like ={99999} for now, not a good way, but kind of ok for what I want.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 snowjaguar
Solution 2 PS saini
Solution 3

Related Questions