Home Examples Charts Dashboard Projects Menu

Vue.js examples
Learn Vue.js

vue js player video

Related:
Vue: Step-By-Step Guide To Mastering Vue.js From Beginner To Advanced (Vue.js, Learning Vue js 2)

The vue-video module is a HTML5 video player component for Vue.js.
To use the HTML5 video player, the visitor needs one of these web browsers:

  • Chrome 4.0
  • IE 9.0
  • Firefox 3.5
  • Safari 4.0
  • Opera 10.5

The file formats supported are MP4 (all), WebM (some) and Ogg (some).

Installation

The git repository is https://github.com/hilongjw/vue-video

You can install it with npm

npm i vue-video --save

vue video

Usage

To use the player import the module and set a link to the video.

import myVideo from 'vue-video'
export default {
data () {
return {
video: {
sources: [{
src: 'http://covteam.u.qiniudn.com/oceans.mp4',
type: 'video/mp4'
}],
options: {
autoplay: true,
volume: 0.6,
poster: 'http://covteam.u.qiniudn.com/poster.png'
}
}
}
},
components: {
myVideo
}
}

Then your template:

<template>
<div id="app">
<div class="container">
<my-video :sources="video.sources" :options="video.options"></my-video>
</div>
</div>
</template>


← Projects poll app vuejs →

© vuejsexamples.net - Privacy Policy - Cookie Policy