1.0.0 • Published 3 years ago

ahs-video v1.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
3 years ago

ahs-video

爱回收 PC 端视频播放器组件

Install

yarn 或 npm
yarn add @ahs/ahs-video
浏览器引入

在浏览器中使用 script 标签直接引入 lib/index.js，即可使用全局变量 AHSVideo

<script src="lib/index.js"></script>

<script>
    new AHSVideo(/* Options */)
</script>

Usage

以下展示了 ahs-video 的所有的配置：

import AHSVideo from '@ahs/ahs-video';

new AHSVideo({
  live: false,
  mini: false,
  autoPlay: false,
  container: '#root',
  title: 'video title',
  url: 'https://path/to/your/video.mp4',
  toUp: (e: MouseEvent) => console.log('向上'),
  toDown: (e: MouseEvent) => console.log('向下'),
  toLeft: (e: MouseEvent) => console.log('向左'),
  toRight: (e: MouseEvent) => console.log('向右'),
  actions: [ { title: '截图', onClick: (e: MouseEvent) => alert('截图') } ],
});

API

属性说明类型默认值
live是否为直播流。为 true 时，视频自动播放且为静音状态booleanfalse
mini播放器迷你模式。该模式下不展示视频时长和标题booleanfalse
autoPlay视频自动播放。为 true 时播放器默认静音状态booleanfalse
container组件容器 id。不要省去 # 前缀，必传string-
title视频标题string-
url视频播放源。必传string-
actions视频控制栏额外操作按钮Action[]-
toUp视频右上角操作盘点击向上时的回调(e: MouseEvent) => void-
toDown视频右上角操作盘点击向下时的回调(e: MouseEvent) => void-
toLeft视频右上角操作盘点击向左时的回调(e: MouseEvent) => void-
toRight视频右上角操作盘点击向右时的回调(e: MouseEvent) => void-
hls.js
1.0.0

3 years ago