【问题标题】:HTML5 <video> element not working in React jsHTML5 <video> 元素在 React js 中不起作用
【发布时间】:2021-07-14 09:42:35
【问题描述】:

我已将 HTML 模板转换为 React js,但现在我无法播放视频,请提供属性 autoPlay="true"。仍然无法正常工作。谁能帮我解决这个问题?

以下是我的视频播放器代码:

       return(
            <div>
                <video width="400" controls autoPlay="true">
                <source src="mov_bbb.mp4" type="video/mp4"/>
                <source src="mov_bbb.ogg" type="video/ogg"/>
                Your browser does not support HTML video.
            </video>
            <p>
            Video courtesy of 
            <a href="<network url of video>" target="_blank">Video is Playing</a>.
            </p>
            </div>
        );

播放器正在打开,但没有任何控件工作,也没有播放视频。 我是否错过了添加任何包或标签>?请告诉我。

【问题讨论】:

标签: reactjs video html5-video


【解决方案1】:

Chrome 会停止所有打开音频的视频的自动播放,因此您添加 muted 属性,还添加 playinline 属性以在 safari 中播放

<video width="400" controls autoPlay={true} muted playsInline >
                <source src="mov_bbb.mp4" type="video/mp4"/>
                <source src="mov_bbb.ogg" type="video/ogg"/>            
</video>

【讨论】:

  • 非常感谢 Goutham J.M. 知道了,现在我必须自定义视频控件。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-10-15
  • 2018-05-19
  • 1970-01-01
  • 1970-01-01
  • 2014-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多