Dplayer 官方文档地址
Dplayer官方地址
虽然在vue中有vue-dplayer但却没有对hls进行很好的支持 所以建议还是使用Dplayer
npm i dplayer
npm i hls.js
在组件中引入
播放m3u8格式的视频需要框选部分 – 建议查看官方文档MSE支持文章来源：https://www.toymoban.com/news/detail-644440.html
切换视频
切换视频需要用到switchVideo() api
文章来源地址https://www.toymoban.com/news/detail-644440.html
方便大家复制 部分片段
this.Dp = new Dplayer({
element:this.$refs.player,
mutex:false,
loop:true,
lang:'zh-cn',
autoplay:true,
preload:'none',
video:{
url:'',
type: 'customHls',
customType: {
customHls: function (video, player) {
console.log('video',video,player);
const hls = new HLS();
hls.loadSource(video.src);
hls.attachMedia(video);
},
},
}
})
到了这里，关于在vue中使用dplayer播放hls m3u8格式视频的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
