Dplayer播放器

安装

npm install vue-dplayer -S

<!--组件调用示例-->
<template>
  <div>
    <d-player :options="options" @play="play" ref="player"> </d-player>
  </div>
</template>
 
<script>
import VueDPlayer from "vue-dplayer";
import "vue-dplayer/dist/vue-dplayer.css";

export default {
  data() {
    return {
      options: {
        video: {
          url: this.src,
        },
        logo:
          "http://oss.api.xxybi.com/uploads/institutions/2/3/logos/2020-10/3/3-1603100058.png.copy",
        autoplay: false,
        contextmenu: [],
      },
      player: null,
    };
  },
  props: {
    src: String, //视频路径
  },
  mounted() {
    this.player = this.$refs.player.dp;
    var menu = document.querySelector(".dplayer-menu");
    if (menu) {
      menu.style.display = "none";
    }
  },
  methods: {
    play() {
      // console.log("play callback");
    },
    switchHandle() {
      this.player.switchVideo({
        url: "http://static.smartisanos.cn/common/video/video-jgpro.mp4",
      });
    },
  },
  components: {
    "d-player": VueDPlayer,
  },
};
</script>