vue引入videojs
时间: 2023-11-29 07:04:18 浏览: 63
vue使用video.js进行视频播放功能
5星 · 资源好评率100%
要在Vue中使用video.js,需要先安装video.js和vue-video-player:
```
npm install video.js vue-video-player --save
```
然后在Vue组件中引入video.js和vue-video-player:
```javascript
import 'video.js/dist/video-js.css'
import 'vue-video-player/src/custom-theme.css'
import 'videojs-contrib-hls'
import VideoPlayer from 'vue-video-player'
export default {
components: {
VideoPlayer
}
}
```
最后在模板中使用`video-player`组件:
```html
<template>
<div>
<video-player ref="videoPlayer" :options="playerOptions"></video-player>
</div>
</template>
<script>
export default {
data () {
return {
playerOptions: {
autoplay: false,
sources: [{
type: 'video/mp4',
src: 'http://example.com/myvideo.mp4'
}]
}
}
}
}
</script>
```
这样就可以在Vue中使用video.js播放器了。
阅读全文