1.0.0 • Published 4 years ago

react-html5video-player v1.0.0

Weekly downloads
1
License
ISC
Repository
-
Last release
4 years ago

react html5video组件

组件是使用react对原生的html5的video标签进行二次封装,重写了播放器的控制器,可以更方便的根据业务场景定制播放器的样式风格,新增了倍速控制器。满足大部分业务场景的使用。

使用参数

props类型默认值说明
autoPlayboolfalse是否自动播放
loopboolfalse是否循环播放
posterstring-视频封面图片地址
controlsstring[]'PlayPause', 'Seek', 'Time', 'PlaybackRate', 'Volume', 'Fullscreen'控制器选项
srcstring-视频地址
childrenelement-视频 <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信息。