Stop playing video when slide is changed

I made a video carousel using React-Player and Swiper.js. I want to stop the video when the slide is changed.

UPDATE: I found a isActive prop from Swiper.js. It stops the video when it's not active which I wanted to originally. But now it also autoplays when the slide becomes the active which I don't want to. How can I stop autoplay? I appreciate any suggestions.

const [isPlaying, setIsPlaying] = useState(false)
  
  <Swiper
      slidesPerView={1.5}
      grabCursor={false}
      loop={false}
      watchSlidesProgress={true}
      modules={[Pagination, Navigation]}
  >
  <SwiperSlide>
   {({ isActive }) => (
          <ReactPlayer
              url='https://www.youtube.com/watch?v=11111'
              controls={true}
              playing={isActive || setIsPlaying(false)}
              config={{
                  youtube: {
                      playerVars: { showinfo: 1 },
                  },
              }}
                    />
     )}
  </SwiperSlide>
 <SwiperSlide>
   {({ isActive }) => (
          <ReactPlayer
              url='https://www.youtube.com/watch?v=11111'
              controls={true}
              playing={isActive || setIsPlaying(false)}
              config={{
                  youtube: {
                      playerVars: { showinfo: 1 },
                  },
              }}
                    />
     )}
  </SwiperSlide>

I also tried using onSlideChange but this doesn't work either.

<Swiper
      onSlideChange={() => {setIsPlaying(false)}}
      watchSlidesProgress={true}
      modules={[Pagination, Navigation]}
      className='mySwiper'
                     >
      <SwiperSlide>
       <div className='player-wrapper'>
            <ReactPlayer url='https://www.youtube.com/watch?v=1111'
                 controls={true}
                 playing={isPlaying} />
       </div>
      </SwiperSlide>   
      <SwiperSlide>
       <div className='player-wrapper'>
            <ReactPlayer url='https://www.youtube.com/watch?v=1111'
                 controls={true}
                 playing={isPlaying} />
       </div>
      </SwiperSlide>