- 安装video.js插件
cnpm install --save video.js
- 在main.js中导入video.js
import Video from 'video.js'
import 'video.js/dist/video-js.css'
- 使用
<template>
<div class="info">
<video
class="video-js"
controls
preload="auto"
:src="mp4Url"
:poster="cover"
:autoplay="playStatus"
:muted="muteStatus"
></video>
</div>
</template>
<script>
export default {
name: "",
components: {},
data() {
return {
cover: "",
playStatus: true,
muteStatus: true,
mp4Url: "https://stream7.iqilu.com/10339/upload_transcode/202002/18/20200218093206z8V1JuPlpe.mp4",
};
},
mounted() {},
beforeDestroy() {},
methods: {}
};
</script>
<style scoped lang="scss">
.info {
width: 424px;
height: 261px;
.video-js {
width: 100%;
height: 239px;
}
}
</style>
- 效果