vue2 <video-player>播放各类格式的视频代码
时间: 2023-08-13 15:07:36 浏览: 72
你可以使用Vue的第三方插件来实现视频播放功能。其中,最流行的插件是video.js插件。
首先,你需要将video.js插件和样式文件引入到你的项目中。可以通过CDN或者本地文件引入。
然后,在你的Vue组件中,使用以下代码实现视频播放功能:
```
<template>
<div>
<video id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264">
<source src="your-video-source.mp4" type='video/mp4'>
<source src="your-video-source.webm" type='video/webm'>
<source src="your-video-source.ogg" type='video/ogg'>
</video>
</div>
</template>
<script>
import videojs from 'video.js'
import 'video.js/dist/video-js.css'
export default {
mounted() {
const player = videojs('my-video')
}
}
</script>
```
你需要替换“your-video-source.mp4”,“your-video-source.webm”和“your-video-source.ogg”为你要播放的视频文件的路径和名称。同时,你也可以根据需要自定义视频播放器的样式。