uniapp video视频组件poster视频封面不显示问题

关于poster视频封面不显示问题:

1、controls属性必须为true(默认);

2、poster路径必须是网络资源地址,即https;

3、视频加载完才行(这个官方没说,所以问题就出在这里);

解决办法就是加个判断,当poster的值加载完成不为空时显示video组件,解决代码如下:

<!-- 视频区域 -->
<view class="video-item">
    <video id="myVideo" v-if="video.thumb" :poster="video.thumb" style="width: 100%;height: 100%;" :src="video.path"></video>
</view>

视频组件加载

//页面准备好时创建video
onReady: function(res) {
    
    
	this.videoContext = uni.createVideoContext('myVideo')
},

//离开页面时暂停视频播放
onHide() {
    
    
    this.videoContext.pause();
},

猜你喜欢

转载自blog.csdn.net/m0_52459016/article/details/122089624
今日推荐