Video 動画再生
使用場面
- 動画コントロール。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 | |
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 |