React JS停止循环后台视频

我正在尝试制作一个带有循环背景视频的页面 React js .

当我编译代码时,我可以看到视频正在浏览器上直接播放,但当我单击网站链接时,视频没有播放。我应该点击 Home 按钮,然后重新开始。

我用过

<video src={BackVideo} autoplay="true" loop="true">

我不能用:

react-native-video

因为在代码中导入库时出错。

另外我还有一个问题,视频没有播放 Safari 完全。

有人能帮帮我吗?

这是我的一部分 Javascript 文件

render() {
    return (
      <div>
        <div className="bgded overlay">
        {/* Menu, call the menu component with the ChangeViewButtonClick function recieved from Dashbaord */}
          <Menu ChangeViewButtonClick={this.props.ChangeViewButtonClick} />

        </div>

        <header className="v-header container">

      <div class="fullscreen-video-wrap">

        <video src={BackVideo} autoplay="true" loop="true"> </video>

    </div>
    <div className="header-overlay"></div>
    <div className="header-content">

       <article>
              <h1 className="heading">Something</h1>
              <h2 className="heading">something too</h2>



            </article>

    </div>
       </header>

        {/* Start of Overview */}
        <div className="wrapper row3">
          <main className="hoc container clear">
            <article className="two_third first">
              <h4 className="font-x2 font-x3">
                Lorem ipsum dolor sit, amet consectetur adipisicing elit. 
                Exercitationem, nihil.
              </h4>


            </article>

          </main>
        </div>
        {/* End of Overview */}
      </div>