javascript - react js html5 视频不工作

标签 javascript reactjs html5-video

我尝试在 stack overflow 和 google 上搜索,但没有找到可以帮助我的文章。即使我使用了自动播放,它也会显示暂停的视频。谁能帮帮我吗 ?我是 react.js 的新手

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import * as ReactBootstrap from 'react-bootstrap';
import coverimg from './hw.jpg';
import covervid from './hw.mp4';
import covervidtwo from './hw.ogv';


class Slider extends Component {
  render() {
    return (
      <div className="">

               <video  loop autoplay>
                   <source src= { covervid } type="video/mp4" />Your browser does not support the video tag. I suggest you upgrade your browser.
                   <source src={ covervidtwo } type="video/ogg" />Your browser does not support the video tag. I suggest you upgrade your browser.
               </video>



      </div>
    );
  }
}

export default Slider;

最佳答案

正如@Pavan kumar Dasireddy 在评论中指出的那样,您想使用 autoPlay 属性(注意大写 P)。

<video  loop autoPlay>
    <source src= { covervid } type="video/mp4" />Your browser does not support the video tag. I suggest you upgrade your browser.
    <source src={ covervidtwo } type="video/ogg" />Your browser does not support the video tag. I suggest you upgrade your browser.
</video>

如果您查看控制台,您会看到:

Warning: Invalid DOM property `autoplay`. Did you mean `autoPlay`?

关于javascript - react js html5 视频不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46845260/

相关文章:

javascript - 如何在 slatejs 中获取光标位置或选择?

html5 视频播放器在音量更改时重新加载

javascript - 有没有办法 JSON.stringify 一个 HTML dom 对象? [JavaScript]

javascript - 当我使用 if/else 语句获取空记录时显示警报

javascript - 如何在React中动态生成导入文件的路径

javascript - 元素仅在 Safari 10 中消失(9 没问题),当我更改任何 css 时显示

javascript - 带有描边的 SVG 蒙版

javascript - 尝试 POST 到 mysql 数据库时 PHP 代码卡在浏览器中(以不同的随机间隔)

javascript - 如果视频 = 持续时间则停止并快退

css - 视频在 chrome android 浏览器中超出父边框