vue中使用DPlayer播放直播流

官方文档

1. 插件安装

npm install dplayer --save

2. 组件中引用

import DPlayer from "dplayer";

3. html中添加

<div id="dplay"></div>

4. 初始化

mounted(){
    initDplayer();
},
methods: {
    initDplayer(){
        const dp = new DPlayer({
            container: document.getElementById("dplay"), // 容器
            loop: true, // 循环播放
            lang: "en", // 语言，可选'en', 'zh-cn', 'zh-tw',
            logo: "", // 在左上角展示一个logo
            
            mutex: false, // 互斥，阻止多个播放器同时播放
            video: { // 视频信息
              type: "hls", // 视频类型 可选"auto", "hls", "flv", "dash"..
              url: "demo.m3u8", // 视频链接
            },
          });
    }
}

5. 尽情享用