https://github.com/MoePlayer/vue-dplayer

📹 A Vue 2.x video player component based on DPlayer
https://github.com/MoePlayer/vue-dplayer

component player vbuild video vue

Last synced: about 1 year ago
JSON representation

📹 A Vue 2.x video player component based on DPlayer

• Host: GitHub
• URL: https://github.com/MoePlayer/vue-dplayer
• Owner: MoePlayer
• Archived: true
• Created: 2017-04-06T14:40:59.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2019-07-17T08:24:55.000Z (almost 7 years ago)
• Last Synced: 2025-03-19T21:54:50.869Z (about 1 year ago)
• Topics: component, player, vbuild, video, vue
• Language: Vue
• Homepage: https://dplayer.netlify.com/
• Size: 661 KB
• Stars: 623
• Watchers: 14
• Forks: 115
• Open Issues: 27
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-vue - vue-dplayer ★378 - A Vue 2.x video player component based on DPlayer. (UI Components / Audio / Video)

README

          
# Vue-DPlayer

> A Vue 2.x video player component based on [DPlayer](https://github.com/DIYgod/DPlayer).

[![NPM version](https://img.shields.io/npm/v/vue-dplayer.svg?style=flat)](https://npmjs.com/package/vue-dplayer) 

[![Vue 2.x](https://img.shields.io/badge/Vue-2.x-brightgreen.svg)](https://vuejs.org/v2/guide/)

[![NPM downloads](https://img.shields.io/npm/dm/vue-dplayer.svg?style=flat)](https://npmjs.com/package/vue-dplayer) 

[Live Demo](https://dplayer.netlify.com/)

## Install

```bash

npm install vue-dplayer -S

```

## Usage

CDN: https://unpkg.com/vue-dplayer@latest/dist/

```js

import VueDPlayer from 'vue-dplayer'

import 'vue-dplayer/dist/vue-dplayer.css'

export default {

  components: {

    'd-player': VueDPlayer

  }

}

```

## Props

[Options Doc](http://dplayer.js.org/#/home?id=options)

| Name | Type | Default | Description |

| ---- | ---- | ------- | ----------- |

| options | Object | -- | all player options |

## Events

[Event binding Doc](http://dplayer.js.org/#/home?id=event-binding)

Example:

```js

export default {

    methods: {

      play() {

        console.log('play callback')

      }

    }

```

## API

you can use all DPlayer [APIs](http://dplayer.js.org/#/home?id=api)

Example:

```js

export default {

    mounted() {

      const player = this.$refs.player.dp

      player.play()

      setTimeout(() => {

        player.pause()

      }, 2000)

    }

```

## Related

- [vue-aplayer](https://github.com/SevenOutman/vue-aplayer)

- [DPlayer](https://github.com/DIYgod/DPlayer)

# License

This content is released under the [MIT](http://opensource.org/licenses/MIT) License.