dplayer安装php_vue-dplayer实现hls播放的步奏详解

这次给大家带来vue-dplayer实现hls播放的步奏详解，vue-dplayer实现hls播放的注意事项有哪些，下面就是实战案例，一起来看一下。

起因

之前写了一篇《 vue2.0+vue-video-player实现hls播放》，里边有提到在用vue-video-player之前，我尝试着使用vue-dplayer实现hls播放，但是当时时间紧迫，还没有完成,就换方案了。现在抽时间把它补齐吧。

开始

安装依赖npm install vue-dplayer -S

编写组件HelloWorld.vue

import VueDPlayer from './VueDPlayerHls';

export default {

name: 'HelloWorld',

data () {

return {

msg: 'Welcome to Your Vue.js App',

video: {

url: 'https://logos-channel.scaleengine.net/logos-channel/live/biblescreen-ad-free/chunklist_w630020335.m3u8',

pic: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg',

type: 'hls'

},

autoplay: false,

player: null,

contextmenu: [

{