关于Video.js的使用方法就不再说了，有兴趣的请迁跃：https://videojs.com/
VideoJS中并没有stop之类控制后台数据请求的参数，只有暂停 video.pause()方法 ，但是对于后台的请求是不会暂停的，如果我页面有多个Vedio实例需要存在，这样就太影响页面效率了
我使用的是Vue 组件化的VedioJS控件
1、动态控制参数close管理video对m3u8的后台请求；
2、动态生成videoID；
3、在子组件中监听closed的值；
watch:{ close(newValue,oldValue){ if(newValue==true){ var player = videojs(this.videoMy); if (typeof (player) != "undefined") { player.pause() //暂停 player.dispose() //销毁 } }else{
//动态生成video $(".vqp").html("<video id=" + this.videoMy + " class=‘vd video-js vjs-default-skin vjs-big-play-centered‘ controls preload=‘none‘ ><source type=‘application/x-mpegURL‘></video>"); this.getVideo() } } },
根据close的值就可以控制video的销毁和创建了，
PS：我用的是Element-ui的dialog 组件中嵌套着VideoJS，遇到一个关于组件未能完全销毁，而新组件就生成的BUG，然后就导致当前Video实例就一直在跑圈圈，有后台数据请求，但无画面的问题，这个问题是因为dialog 隐藏后还未完全销毁前，遇到了新的实例创建，这个问题也属于疑难杂症可以仍旧使用 $nextTicket ，也可以在videoA组件上加一个v-if判断就行了
关于Vue使用VideoJS实例销毁、创建，并控制后台m3u8的数据请求
原文：https://www.cnblogs.com/bomdeyada/p/10862568.html