## Tcplayer 播放器 组件内部集成了[腾讯云Web超级播放器 TCPlayerLite](https://cloud.tencent.com/document/product/881/20207#.E5.BC.80.E5.90.AF.E4.BC.98.E5.85.88-h5-.E6.92.AD.E6.94.BE.E6.A8.A1.E5.BC.8F)。 使用时无需再次引入腾讯云播放器sdk，直接使用此播放器组件，传入相应参数即可。 常用于视频回放和即时直播，如对海康、大华等监控设备抓取的视频进行回放或实时观看。 ### 代码示例 基础用法  ```html <cvu-tcplayer m3u8="http://1258876183.vod2.myqcloud.com/fe5259fbvodtranscq1258876183/f950151d5285890788091139489/drm/v.f220.m3u8" width="500" height="380" ></cvu-tcplayer> ``` 自动播放 > 设置`autoplay`属性开启自动播放  ```html <cvu-tcplayer m3u8="http://1258876183.vod2.myqcloud.com/fe5259fbvodtranscq1258876183/f950151d5285890788091139489/drm/v.f220.m3u8" width="500" height="380" autoplay ></cvu-tcplayer> ``` ### props | 属性 | 说明 | 类型 | 默认值 | | --- | --- | --- | --- | | m3u8 | 视频地址，支持点播、直播 | String | 无 | | mp4 | 视频地址，仅支持点播 | String | 无 | | webrtc | 视频地址，仅支持直播 | String | 无 | | flv | 视频地址，支持点播、直播 | String | 无 | | rtmp | 视频地址，仅支持直播 | String | 无 | | autoplay | 是否自动播放 | Boolean | false | | preload | 是否自动预加载 | String | auto | | live | 是否开启直播 | Boolean | false | | width | 播放器宽度 | Number \/Strnig | 500 | | height | 播放器高度 | Number\/String | 380 | | volume | 音量 | Number | 0.3 | | poster | 封面 | String\/Object | 无 | | controls | default 显示默认控件，none 不显示控件，system 移动端显示系统控件。 | String | 'default' | | x5_type | 声明启用 H5同层播放器 | String | h5-page | | x5_orientation | 播放器支持的方向，可选值：0（`landscape`横屏），1（`portraint`竖屏），2（`landscape` /`verbar`/`portrait`跟随手机自动旋转）| Number | 无 | ### methods | 方法名 | 说明 | 返回值 | 示例 | | --- | --- | --- | --- | | play | 开始播放 | 无 | palyer.play() | | pause | 暂停播放 | 无 | player.pause() | | duration | 获取视频时长 | 视频时长 | player.duration() | | currentTime | 设置视频播放时间点 | 无 | player.currentTime(time) | | fullscreen | 是否全屏播放 | 无 | player.fullscreen(true/false) | | destroy | 销毁播放器 | 无 | player.destroy() |