在使用此引导标头时遇到问题

时间:2019-05-26 04:38:47

标签: javascript reactjs bootstrap-4

我已将引导程序安装到我的应用程序中,但是我正在使用的此视频标头未在本地服务器上正确显示。所以我猜想这种依赖关系对我没有用。

CodePen https://codesandbox.io/s/react-hooks-counter-demo-8w7yv

我已经下载了引导程序,并且在节点模块中显示它正在沙箱中工作,但在我的服务器上却没有     从“反应”中导入React,{组件}     从“ react-router-dom”导入{Link};

export default class Intro extends Component {
  render() {
    return (
      <header>
        <div className="overlay"></div>
        <video playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
          <source src="https://storage.googleapis.com/coverr-main/mp4/Mt_Baker.mp4" type="video/mp4"/>>
        </video>
        <div className="container h-100">
          <div className="d-flex h-100 text-center align-items-center">
            <div className="w-100 text-white">
              <h1 className="display-3">Video Header</h1>
              <p className="lead mb-0">With HTML5 Video and Bootstrap 4</p>
            </div>
          </div>
        </div>
      </header>      
    )
  }
}

1 个答案:

答案 0 :(得分:1)

我似乎无法正确理解您的问题。但是,用您的Code Pen,我用您的视频源代码替换了它的内容,并看到了它的工作原理。请检查下面的图片

enter image description here