> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Video 视频播放

> Video 视频播放组件文档，介绍视频地址、封面与播放控制等属性配置，支持 mp4、mov 等 HTML 原生视频格式。

## 何时使用

-视频控件，用于播放 mp4、mov 等 HTML 原生支持的视频资源。

## 组件示例

<iframe src="https://www.aliwork.com/developer/video-v2?isRenderNav=false" width="100%" height="480" frameBorder="0" />

## 组件属性

| 属性                     | 说明                                          | 类型                                                                                  | 默认值                                                                               |
| ---------------------- | ------------------------------------------- | ----------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
| `autoplay`             | 自动播放，可能在某些场景下无法起作用                          | `boolean`                                                                           | `false`                                                                           |
| `canPlayThrough`       | 当加载完成可以播放时                                  | `(ctx: object) => void`                                                             | -                                                                                 |
| `controls`             | 控制条                                         | `boolean`                                                                           | `true`                                                                            |
| `controlsList`         | 定制原生控制条                                     | `'nodownload' \| 'nofullscreen' \| 'noremoteplayback' \| 'disablePictureInPicture'` | -                                                                                 |
| `loop`                 | 循环播放，播放完成后是否自动循环播放                          | `boolean`                                                                           | `false`                                                                           |
| `muted`                | 是否静音                                        | `boolean`                                                                           | `false`                                                                           |
| `onEnded`              | 当视频播放结束时                                    | `(ctx: object) => void`                                                             | -                                                                                 |
| `onEnterFullscreen`    | 当全屏时                                        | `(ctx: object) => void`                                                             | -                                                                                 |
| `onError`              | 当播放出错时                                      | `(ctx: object) => void`                                                             | -                                                                                 |
| `onExitFullscreen`     | 当退出全屏时                                      | `(ctx: object) => void`                                                             | -                                                                                 |
| `onPause`              | 当视频暂停时                                      | `(ctx: object) => void`                                                             | -                                                                                 |
| `onPlay`               | 当开始播放时                                      | `(ctx: object) => void`                                                             | -                                                                                 |
| `pipControls`          | 画中画，只在 chrome，safari 浏览器上生效，firefox 和手机端不生效 | `boolean`                                                                           | `false`                                                                           |
| `playbackRate`         | 倍数列表                                        | `array`                                                                             | `[ 0.8, 1, 1.5, 2 ]`                                                              |
| `playbackRateControls` | 是否显示倍数播放                                    | `boolean`                                                                           | `false`                                                                           |
| `poster`               | 封面图片URL                                     | `string`                                                                            | -                                                                                 |
| `sizeFit`              | 画面适配模式                                      | `'contain' \| 'fill' \| 'cover' \| 'scale-dowm' \| 'none'`                          | `'contain'`                                                                       |
| `timeUpdate`           | 当播放时间更新时                                    | `(ctx: object) => void`                                                             | -                                                                                 |
| `title`                | 原生标题，用于设置html 原生 title属性，在用户鼠标hover时显示      | `string`                                                                            | -                                                                                 |
| `url`                  | 视频URL地址                                     | `string`                                                                            | `'https://cloud.video.taobao.com/play/u/1804320196/p/1/e/6/t/1/287344840104.mp4'` |
| `volume`               | 音量大小，最小为0，最大为1                              | `number`                                                                            | `1`                                                                               |
| `volumeControls`       | 是否显示声音控件                                    | `boolean`                                                                           | `true`                                                                            |
