- uniapp安卓使用原生的video标签层级太高,会固定在视口不跟随页面滚动
- 新建nVideo.vue文件
-
<template> <iframe :onload="onloadCode" style="width:100%;height:100%;border:1px solid #fff;background: #000;"></iframe> </template> <script> export default { props: { src: {} }, data() { return { onloadCode: '' } }, created() { this.onloadCode = `this.contentWindow.document.body.innerHTML = '<video style="width: 100%;height: 100%" controls="controls" src="${this.src}"></video>';` }, }
- 在需要的页面引入
-
import nVideo from '../../nVideo.vue' components: { nVideo }
- 使用
<nVideo :src="baseUrl+videoUrl" style="height: 400rpx;width: 100%;"></nVideo>