> ## 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.

# 動画

> 動画コンポーネントの設定ガイド。動画 URL・ポスター画像・再生制御などのコンポーネントプロパティを解説し、mp4 や mov など HTML ネイティブの動画形式に対応した実装方法を紹介します。

## 使用シーン

* mp4 や mov など HTML ネイティブの動画リソースを再生するための動画コントロールです。

## コンポーネントの例

## コンポーネントプロパティ

| 属性                     | 説明                                                          | タイプ                                                                                 | デフォルト                                                                             |
| ---------------------- | ----------------------------------------------------------- | ----------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- |
| `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 属性を設定し、マウスホバー時に表示されます。          | `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`                                                                            |