src/components/mini/box14-video.vue

@@ -68,7 +68,7 @@
<template>
   <div>
      <div class="videoBoxList">
         <div class="myVideo" v-for=" (temp,index) in ['test1','test2','test3']">
         <div class="myVideo" v-for=" (temp,index) in ['test1','test2','test3','test4','test5']">
            <div :id="temp" :ref="temp" class="dplayer"></div>
            <!-- <div class="mark" ></div> -->
            <!-- <img src="qq.png"> -->
@@ -127,10 +127,8 @@
         return {
            dp: null,
            video: {},
            video1: {
            },
            video2: {
            },
            video1: {},
            video2: {},
         }
      },
      methods: {
@@ -148,7 +146,7 @@
               lang: "zh-cn", // 语言，'en', 'zh-cn', 'zh-tw'
               // screenshot: true, // 是否允许截图（按钮），点击可以自动将截图下载到本地
               preload: "auto", // 自动预加载
               volume: 0, // 初始化音量
               volume: 0.1, // 初始化音量
               playbackSpeed: [2, 1, 0.5], //可选的播放速度，可自定义
               contextmenu: [
                  //  自定义上下文菜单
@@ -179,7 +177,7 @@
               video: {
                  pic: videoInfo.img, // 视频封面
                  url: videoInfo.url,
                  type: 'customHls',
                  type: videoInfo.type,
                  customType: {
                     customHls: function(video, player) {
                        const hls = new Hls()
@@ -193,12 +191,29 @@
      },
      mounted() {
         this.video1 = {
            img: "http://t.inleft.com/share/media_photo/idea_beijing.jpg",
            url: "http://t.inleft.com/share/myVideo/faye/faye.m3u8"
            img: "http://t.inleft.com/share/media_photo/faye_video.png",
            url: "http://t.inleft.com/share/myVideo/faye/faye.m3u8",
            type: "customHls"
         }
         this.video2 = {
            img: "http://t.inleft.com/share/media_photo/idea_beijing.jpg",
            url: "http://t.inleft.com/share/myVideo/canon/canon.m3u8"
            url: "http://t.inleft.com/share/myVideo/canon/canon.m3u8",
            type: "customHls"
         }
         this.video3 = {
            img: "http://t.inleft.com/share/media_photo/idea_beijing.jpg",
            url: "http://t.inleft.com/share/mp3/EOPMusic%283%29.mp3",
            type: "normal"
         }
         this.video4 = {
            img: "http://t.inleft.com/share/media_photo/idea_beijing.jpg",
            url: "http://t.inleft.com/share/mp3/EOPMusic%284%29.mp3",
            type: "normal"
         }
         this.video5 = {
            img: "http://t.inleft.com/share/media_photo/idea_beijing.jpg",
            url: "http://t.inleft.com/share/mp3/EOPMusic%282%29.mp3",
            type: "normal"
         }

         // getVideo: ajax request for getting videoInfo
@@ -217,6 +232,9 @@
         }
         this.loadVideo(this.video1, "test1")
         this.loadVideo(this.video2, "test2")
         this.loadVideo(this.video3, "test3")
         this.loadVideo(this.video4, "test4")
         this.loadVideo(this.video5, "test5")

         // 以下为隐藏一些作者的信息和视频播放源 如不需要可删除
         // document.querySelector(".dplayer-menu").remove(); //隐藏右键菜单