- 发布：2024-11-18 03:09
- 更新：2024-11-18 03:09
- 阅读：141
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： windows11
HBuilderX类型： 正式
HBuilderX版本号： 4.29
手机系统： 全部
手机厂商： 华为
页面类型： vue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
测试过的手机：
示例代码：
<uni-popup ref="previewRef" type="bottom" background-color="rgba(0,0,0,0.1)">
<view class="preview-container">
<view class="media-box">
<image class="preview-img" :src="form.medias[previewIdx].url" mode="aspectFit" v-show="form.medias[previewIdx].type == 'image'"></image>
<video class="preview-video" :src="form.medias[previewIdx].url" controls v-if="form.medias[previewIdx].type == 'video'"></video>
</view>
<uni-icons class="icon-prev" size="40" color="#fff" type="left" @click="handlePrev"></uni-icons>
<uni-icons class="icon-next" size="40" color="#fff" type="right" @click="handleNext"></uni-icons>
<uni-icons class="icon-close" type="close" size="40" color="#fff" @click="() => previewRef.close()"></uni-icons>
</view>
</uni-popup>
<uni-popup ref="previewRef" type="bottom" background-color="rgba(0,0,0,0.1)">
<view class="preview-container">
<view class="media-box">
<image class="preview-img" :src="form.medias[previewIdx].url" mode="aspectFit" v-show="form.medias[previewIdx].type == 'image'"></image>
<video class="preview-video" :src="form.medias[previewIdx].url" controls v-if="form.medias[previewIdx].type == 'video'"></video>
</view>
<uni-icons class="icon-prev" size="40" color="#fff" type="left" @click="handlePrev"></uni-icons>
<uni-icons class="icon-next" size="40" color="#fff" type="right" @click="handleNext"></uni-icons>
<uni-icons class="icon-close" type="close" size="40" color="#fff" @click="() => previewRef.close()"></uni-icons>
</view>
</uni-popup>操作步骤：
video的src用的是https://aokerg8937.blob.core.windows.net/aoke/1731863837196.mp4
video的src用的是https://aokerg8937.blob.core.windows.net/aoke/1731863837196.mp4
预期结果：
安卓和ios能正常显示视频内容
安卓和ios能正常显示视频内容
实际结果：
安卓和ios视频标签都显示黑屏
安卓和ios视频标签都显示黑屏
bug描述：
视频标签在安卓和ios上显示都是黑屏，运行到web浏览器却是正常的
