DashVideo
DASH video element powered by dash.js for adaptive bitrate streaming
DASH video element powered by dash.js for MPEG-DASH adaptive bitrate streaming.
Examples
Basic Usage
import { DashVideo } from '@videojs/react/media/dash-video';
export default function BasicUsage() {
return <DashVideo className="dash-video" src="https://dash.akamaized.net/akamai/streamroot/050714/Spring_4Ktest.mpd" autoPlay muted playsInline loop />;
}
.dash-video {
width: 100%;
aspect-ratio: 16 / 9;
}
<media-container class="media-container">
<dash-video
src="https://dash.akamaized.net/akamai/streamroot/050714/Spring_4Ktest.mpd"
autoplay
muted
playsinline
loop
></dash-video>
</media-container>
.media-container {
position: relative;
display: block;
width: 100%;
aspect-ratio: 16 / 9;
}
import '@videojs/html/media/container';
import '@videojs/html/media/dash-video';
API Reference
Props
Accepts the standard React props for a native <video>
, plus these Video.js-specific props:
| Prop | Type | Default | Details |
|---|---|---|---|
src
|
string
|
''
|
Ref
Forwards its ref to the rendered <video>. The ref is an HTMLVideoElement
and exposes its complete native property and method API.
Events
Handle standard media events with React event props such as onPlay and onTimeUpdate. For native events without a
React prop, attach a listener through the ref with addEventListener.