Video是属于原生组件的,层级是最高的,无法被其他内容所覆盖,当然也不会跟着div的overflow-y:scroll进行滑动,只会一直浮在表层,挡住其他元素
uni的官方文档解释是这样的:vue页面层级覆盖解决方案

• cover-view
  更适合在视频上边添加某些组件,比如播放按钮或者什么功能,这个比不符合我的需求

• plus.nativeObj.view
  这个是安卓的原生写法,看了很多资料,发现是能解决相当多种类的问题,但是毕竟原生语法会难一些,在时间不够的情况下很难去学好怎么使用原生语言满足当前的需求
  但如果时间充足且有条件的基础下可以采用这个方法
  https://www.html5plus.org/doc/zh_cn/video.html

• subNVue
  首先就被舍弃了,只因我用的不是NVue

最后在网上参考了其他人的一份解决方案,正好解决了我的问题直接上代码

1. 创建一个uni组件,通过用iframe作为主体,嵌入video组件,让页面跟着div滑动

<template>
  <iframe :onload="onloadCode" style="width:100%;height:100%;border:1px solid #fff;background: #000;"></iframe>
</template>

<script setup>
const props = defineProps({
  videoUrl: String
})
let onloadCode = `
const url = '${props.videoUrl}'  
                this.contentWindow.document.body.innerHTML = '<video style="width: 100%;height: 100%" controls="controls"  src="'+url+'"></video>';  
`

</script>

2. 在页面中使用新建的组件

<MyVideo :videoUrl="videoUrl"></MyVideo>

这样就完美解决了滑动的问题,完美~!