video-player-hooks

基于 React Hooks 和 video.js 的在线流媒体解决方案

Install

npm install video-player-hooks -S

Example

import VideoPlayer from 'video-player-hooks';

// ...

<VideoPlayer
  src={'**********.m3u8'}
  onPlay={(player) => {
    if (!player) return;
    console.log('play：', player.cache_.src);
  }}
  onError={(player) => {
    if (!player) return;
    console.log('error', player.cache_.src);
    // 重新加载
    player.reset();
    player.src({
      type: 'application/x-mpegURL',
      src: player.cache_.src
    });
  }}
/>;

// ...

API

| key | 描述 | 类型 | | :------------- | :--------------- | :---------------------- | | src | 播放地址 | string | | id | 视频容器 id | string | | className | 类名 | string | | theme | 主题 | 'light'或'night' | | option | videojs 配置 | VideoJsPlayerOptions | | onPause | 暂停回调 | (VideoJsPlayer) => void | | onError | 错误回调 | (VideoJsPlayer) => void | | onPlay | 播放（还未开始） | (VideoJsPlayer) => void | | canPlay | 已经开始播放 | (VideoJsPlayer) => void | | onBeforeChange | 切换源前 | (VideoJsPlayer) => void | | onDestroy | 销毁回调 | (VideoJsPlayer) => void |