The installation

NPM install - save video - the reactCopy the code

use

Import {Player, ControlBar, PlayToggle, // PlayToggle play/pause button Disabled ReplayControl, // Back button ForwardControl, CurrentTimeDisplay, TimeDivider, PlaybackRateMenuButton, VolumeMenuButton} from 'video-react'; import "video-react/dist/video-react.css"; // import cssCopy the code

page

<Player ref={c => { this.player = c; }} autoPlay='true' playsInline ='true' src={this.state.videoUrl} poster="https://video-react.js.org/assets/poster.png" > <ControlBar autoHide={false} disableDefaultControls={source == 0? False :true}> <ReplayControl seconds={10} Order ={1.1} /> <PlayToggle /> <CurrentTimeDisplay order={4.1} /> <TimeDivider order={4.2} /> <PlaybackRateMenuButton rates={[5, 2, Order ={7.1} /> <VolumeMenuButton /> </ControlBar> </Player>Copy the code

Hide progress bar and disable click control player

<Player ref={ref => this.player = ref}
        playsInline
        autoPlay={true}
        src={URL}>
        <Shortcut clickable={false}
                  dblclickable={false}/>
        <BigPlayButton position="center"/>
        <ControlBar className="controlBar" autoHide={true}
                    disableDefaultControls={true}/>
</Player>

Copy the code

Property link: video-react.js.org/components/…

Source link: blog.csdn.net/weixin_4443…