Reactjs 在React JS Carousel可重用组件中更改幻灯片时暂停视频？

我有一个可重复使用的引导转盘组件，它可以渲染不同的视频，并且运行良好，但是当播放视频时，幻灯片会更改为下一张幻灯片或上一张幻灯片，视频不会暂停，但会继续播放。我想在更改幻灯片时暂停，但我真的不知道如何在React JS中实现这一点。 我会在我的旋转木马组件代码下面附上，也许会有帮助

另外，如果还有什么我需要补充的，请告诉我。 非常感谢：）

import React，{Component}来自“React”；
导入'bootstrap/dist/css/bootstrap.min.css'；
从“react引导/旋转木马”导入旋转木马；
导入“./carousel.css”；
导出默认类VideoCarousel扩展组件{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
{this.props.items.map（（项目，索引）=>{
返回(
{/*{item.title}*/}
);
})}
)
}
}

import React, { Component } from "react";
import 'bootstrap/dist/css/bootstrap.min.css';
import Carousel from 'react-bootstrap/Carousel';
import "../carousel.css";

export default class VideoCarousel extends Component {
  constructor(props) {
    super(props);
  }

  render(){
    return(
      <div>
      <Carousel interval={null}  className="carousel">
          {this.props.items.map((item, index) => {
              return (
                  <Carousel.Item key={index}>
                  <video className="videoItem" controls="controls">
                        <source src={item.src} type="video/mp4"/>
                    </video>
                  <Carousel.Caption>
                    {/* <h2>{item.title}</h2> */}
                  </Carousel.Caption>
                  </Carousel.Item>
              );
          })}
      </Carousel>
      </div>
    )
  }
}