All Projects → MoePlayer → Vue Dplayer

MoePlayer / Vue Dplayer

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

Projects that are alternatives of or similar to Vue Dplayer

React Video Renderer
Build custom video players effortless
Stars: ✭ 100 (-82.3%)
Mutual labels:  player, component
React Dplayer
react-dplayer
Stars: ✭ 130 (-76.99%)
Mutual labels:  player, component
React Music Player
🎵 Maybe the best beautiful HTML5 responsive player component for react :)
Stars: ✭ 321 (-43.19%)
Mutual labels:  player, component
Ksymediaplayer ios
金山云iOS播放SDK(KSYUN Live Streaming player SDK),支持RTMP HTTP-FLV HLS 协议(supporting RTMP HTTP-FLV HLS protocol),直播延时2-3秒(Living delay 2 or 3 seconds)
Stars: ✭ 516 (-8.67%)
Mutual labels:  player
Ember Power Select
The extensible select component built for ember.
Stars: ✭ 521 (-7.79%)
Mutual labels:  component
React Native Fit Image
Responsive image component to fit perfectly itself.
Stars: ✭ 539 (-4.6%)
Mutual labels:  component
React Markdown Editor Lite
a light-weight Markdown editor based on React. 一款轻量的基于React的markdown编辑器
Stars: ✭ 553 (-2.12%)
Mutual labels:  component
Wlmedia
Android 音视频播放SDK,几句代码即可实现音视频播放功能(支持:手机、电视盒子等设备。支持:http、https、rtsp、rtp、rtmp、byte[]、加密视频和各种文件格式视频;包含视频截图、音轨选择、字幕选择、循环播放、设置软解或硬解、自定义视频滤镜、透明视频、变速变调、声道切换、无缝切换surface(surfaceview和textureview)、视频比例设置、多路音视频播放等。)~
Stars: ✭ 505 (-10.62%)
Mutual labels:  player
React Range
🎚️Range input with a slider. Accessible. Bring your own styles and markup.
Stars: ✭ 545 (-3.54%)
Mutual labels:  component
Ngx Ui
🚀 Style and Component Library for Angular
Stars: ✭ 534 (-5.49%)
Mutual labels:  component
Vue Plyr
A Vue component for the plyr (https://github.com/sampotts/plyr) video & audio player.
Stars: ✭ 531 (-6.02%)
Mutual labels:  component
Vue Draggable Resizable Gorkys
Vue 用于可调整大小和可拖动元素的组件并支持冲突检测、元素吸附、元素对齐、辅助线
Stars: ✭ 521 (-7.79%)
Mutual labels:  component
Live Torrent
Torrent Web Client
Stars: ✭ 546 (-3.36%)
Mutual labels:  player
React Progress Button
🌀 Simple react.js component for an inline progress indicator
Stars: ✭ 516 (-8.67%)
Mutual labels:  component
Vue Img Inputer
🏞 A graceful image type inputer / uploader
Stars: ✭ 548 (-3.01%)
Mutual labels:  component
Toastnotifications
Toast notifications for WPF allows you to create and display rich notifications in WPF applications. It's highly configurable with set of built-in options like positions, behaviours, themes and many others. It's extendable, it gives you possibility to create custom and interactive notifications in simply manner.
Stars: ✭ 507 (-10.27%)
Mutual labels:  component
Vuesax
New Framework Components for Vue.js 2
Stars: ✭ 5,293 (+836.81%)
Mutual labels:  component
Date Time Picker
Angular Date Time Picker (Responsive Design)
Stars: ✭ 528 (-6.55%)
Mutual labels:  component
Bilidan
Play videos on Bilibili.com with MPV and Danmaku2ASS
Stars: ✭ 525 (-7.08%)
Mutual labels:  player
Folding Cell Android
📃 FoldingCell is a material design expanding content cell inspired by folding paper material made by @Ramotion
Stars: ✭ 4,859 (+760%)
Mutual labels:  component

Vue-DPlayer

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

NPM version Vue 2.x NPM downloads

Live Demo

Install

npm install vue-dplayer -S

Usage

CDN: https://unpkg.com/[email protected]/dist/

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

export default {
  components: {
    'd-player': VueDPlayer
  }
}

Props

Options Doc

Name Type Default Description
options Object -- all player options

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.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].