1.0.1 • Published 2 years ago
jiker-tcplayer v1.0.1
jiker-tcplayer
基于腾讯Web播放器SDKTcPlayer 封装的vue播放器组件
Usage
下载安装
npm install jiker-tcplayer
main内引入
import j-video from 'jiker-tcplayer'
Vue.use(j-video)直接在页面使用
<j-video :id="tc-player-id" :options="options" autoplay/>属性
| 属性名 | 类型 | 是否必须 | 默认值 | 说明 |
|---|---|---|---|---|
| id | String | 是 | 无 | 播放器唯一指定id |
| width | Number, String | 否 | 414 | 播放器宽度 |
| height | Number, String | 否 | 270 | 播放器高度 |
| autoplay | Boolean | 否 | false | 是否自动播放 |
| muted | Boolean | 否 | false | 是否静音播放 |
| loop | Boolean | 否 | false | 是否循环播放 |
| playbackRates | Array | 否 | 0.5,1,1.5,1.8 | 播放器速率 |
| options | Object | 是 | 无 | 例：{fileID:"3701925921299637010",appID:"1500005696",psign: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhcHBJZCI6MTUwMDAwNTY5NiwiZmlsZUlkIjoiMzcwMTkyNTkyMTI5OTYzNzAxMCIsImN1cnJlbnRUaW1lU3RhbXAiOjE2MjY4NjAxNzYsImV4cGlyZVRpbWVTdGFtcCI6MjYyNjg1OTE3OSwicGNmZyI6InByaXZhdGUiLCJ1cmxBY2Nlc3NJbmZvIjp7InQiOiI5YzkyYjBhYiJ9LCJkcm1MaWNlbnNlSW5mbyI6eyJleHBpcmVUaW1lU3RhbXAiOjI2MjY4NTkxNzksInN0cmljdE1vZGUiOjJ9fQ.Bo5K5ThInc4n8AlzIZQ-CP9a49M2mEr9-zQLH9ocQgI"} |
组件实例方法
| 方法名 | 参数 | 返回值 | 说明 |
|---|---|---|---|
| play | 无 | 无 | 播放视频 |
| pause | 无 | 无 | 暂停播放 |
| getDuration | 无 | 返回视频总时长 | |
| getCurrentTime | 无 | 返回视频已经播放的时长 | |
| setCurrentTime | 时间(分) | 无 | 设置视频指定进度播放 |
| setPosterImg | 图片地址(String) | 无 | 设置封面图 |
| openFullScreen | 无 | 无 | 打开全屏 |
| exitFullScreen | 无 | 无 | 退出全屏 |
| isFullScreen | 无 | 无 | 返回是否全屏 (Boolean) |
| getResolutionSize | 无 | 无 | 获取视频分辨率尺寸,返回值{width,height} |
| destroy | 无 | 无 | 销毁播放器实例 |
@ready //组件抛出初始化回调 封装 键盘事件
| 键位 | 作用 |
|---|---|
| 空格 | 播放、暂停 |
| 左 | 快退 |
| 右 | 快进 |
| 上 | 音量提高 |
| 下 | 音量降低 |