VUE2.x可以使用vue-video-player吗
时间: 2023-12-14 14:33:24 浏览: 106
可以使用vue-video-player来在VUE2.x中播放视频。vue-video-player是一个基于video.js的Vue 2.x视频播放器组件,可以轻松地在Vue项目中使用。以下是一个简单的示例:
首先,安装vue-video-player:
```shell
npm install vue-video-player --save
```
然后,在Vue组件中引入vue-video-player并使用:
```vue
<template>
<div>
<video-player ref="videoPlayer" :options="playerOptions" @play="onPlayerPlay($event)" />
</div>
</template>
<script>
import VideoPlayer from 'vue-video-player'
import 'video.js/dist/video-js.css'
import 'vue-video-player/src/custom-theme.css'
export default {
components: {
VideoPlayer
},
data () {
return {
playerOptions: {
autoplay: false,
controls: true,
sources: [{
type: 'video/mp4',
src: 'your-video-source.mp4'
}]
}
}
},
methods: {
onPlayerPlay (player) {
console.log('player play!', player)
}
}
}
</script>
```
在上面的示例中,我们首先导入vue-video-player和video.js的CSS文件。然后,在组件中使用`<video-player>`标签,并将视频源添加到`playerOptions`对象中。最后,我们可以使用`@play`事件来监听播放器的播放事件。
阅读全文