How to auto stop video?

Question

React

The page has a slider component. it consists of pictures and one slide with video. for the slide that is currently being shown, isActive=true. How to automatically stop a video if it is on a slide that is not currently visible?
video component:

<video id="video" src={video} className={styles.video} loop muted autoPlay playsInline/>

Answer 1

The slide must have a visible/not visible attribute. And if "not visible" - then you can stop the video like this:

video.pause();
video.currentTime = 0;

// где video - ссылка на DOM элемент (по id или через ref)

Or, if nothing plans to change, then just stop the video always if the slide number is not equal to the slide number with the video.