dplayer-vue

A Vue video player component based on DPlayer

Usage no npm install needed!

<script type="module">
  import dplayerVue from 'https://cdn.skypack.dev/dplayer-vue';
</script>

README

DPlayer-Vue

A Vue video player component based on DPlayer.

NPM version NPM downloads

Install

npm install dplayer-vue -S

Usage

import VueDPlayer from "dplayer-vue"

export default {
  components: {
    "d-player": VueDPlayer,
  },
}

OR

import Vue from "vue"
import VueDPlayer from "dplayer-vue"
Vue.use(VueDPlayer)

Props

Options Doc

Name Type Default Description
options Object -- all player options

Example:

<d-player :options="options"></d-player>

export default {
    data() {
      return {
        options: {
          apiBackend: {
            read: (callback) => {
              callback.error()
              callback.success()
            },
            send: (callback) => {
              callback.error()
              callback.success()
            }
          }
        }
      }
    }

Events

Event binding Doc

Example:

<d-player @play="play"></d-player>

export default {
    methods: {
      play() {
        console.log('play callback')
      }
    }

API

you can use all DPlayer APIs

Example:

<d-player ref="player"></d-player>

export default {
    mounted() {
      const player = this.$refs.player.dp
      player.play()
      setTimeout(() => {
        player.pause()
      }, 2000)
    }

Related

License

This content is released under the MIT License.