1.0.0 • Published 4 years ago
react-html5video-player v1.0.0
react html5video组件
组件是使用react对原生的html5的video标签进行二次封装,重写了播放器的控制器,可以更方便的根据业务场景定制播放器的样式风格,新增了倍速控制器。满足大部分业务场景的使用。
使用参数
props | 类型 | 默认值 | 说明 |
---|---|---|---|
autoPlay | bool | false | 是否自动播放 |
loop | bool | false | 是否循环播放 |
poster | string | - | 视频封面图片地址 |
controls | string[] | 'PlayPause', 'Seek', 'Time', 'PlaybackRate', 'Volume', 'Fullscreen' | 控制器选项 |
src | string | - | 视频地址 |
children | element | - | 视频 <source src='' /> |
也可以传递一些其他参数,组件内部也会传递到控制器中
使用
import VideoPlayer from 'react-video';
export default () => {
return (
VideoPlayer
autoPlay
loop
controls={['PlayPause', 'Seek', 'Time', 'Volume', 'Fullscreen']}
poster={''}>
<source src='' type='video/MP4'/>
</VideoPlayer>
)
}
使用中可以用ref来接收video对象,它拥有video元素的所有属性和方法,方便使用者灵活使用video信息。
1.0.0
4 years ago