移动端实现播放视频，阻止弹窗下内容滑动

       最近做项目遇到这样的需求：实现移动端播放视频，点击播放按钮，弹窗播放。一开始就直接按照套路做了一下，发现一个bug，弹窗播放视频时候，虽然占满全屏，上下滑动，关掉视频发现下面的内容都被滑动到最后了，这时候我们需要阻止一下视频弹窗默认行为来解决这个bug，先上代码：

视频弹窗

　　

<div class="video-dialog">
    <video
        :src="videoSrc"
        x5-video-orientation="portraint"
        x-webkit-airplay="allow"
        x5-video-player-fullscreen="true"
        playsinline
        webkit-playsinline="true"
        preload="auto"
        controls
    ></video>
</div>    

<script>
    document.addEventListener('touchmove', (e) => {
    if(e.target.className.indexOf('video-dialog') > -1) {
        e.preventDefault();
    }
},{passive: false});
</script>

完美解决了！