vue 使用vue-video-player加载视频
npm install vue-video-player --save
import VideoPlayer from "vue-video-player"
import "video.js/dist/video-js.css"
import "vue-video-player/src/custom-theme.css"
import "videojs-flash"
Vue.use(VideoPlayer)
<divclass="spItemBox"v-for="(item, i) in videoList":key="i"><video-playerstyle="width: 100%; height: 100%; object-fit: fill"class="video-player vjs-custom-skin"ref="videoPlayer":playsinline="true":options="playerOptions[i]"></video-player></div>
export default {data() {return {playerOptions: [],videoList: [{}, {}, {}, {}],};},mounted() {for (let index = 0; index < 4; index++) {let url = require("../../../../../assets/videos/video1.mp4"); const obj = {autoplay: false, muted: true, loop: true, preload: "auto", language: "zh-CN",aspectRatio: "14:6", fluid: true, sources: [{type: "video/mp4", src: url, },],poster: "", notSupportedMessage: "此视频暂无法播放,请稍后再试", controlBar: {timeDivider: false,durationDisplay: false,remainingTimeDisplay: false,fullscreenToggle: false, },};this.playerOptions.push(obj);}},
};