先加载封面图，用户点击后再切换为视频标签
效果：
文章来源：https://www.toymoban.com/news/detail-518465.html
<view class="ContainerStudyVideo-live" v-for="(item, index) in datalist" v-bind:key="index">
<view class="ContainerStudyVideo-image">
<image mode="aspectFill" v-if="!item.pause" :src="item.coverImagePath" @click="pauseVideo(item)"></image>
<video
v-else
:id="`myVideo${index}`"
controls
:autoplay="true"
:src.sync="item.videoPath"
:show-center-play-btn="true"
:poster="item.coverImagePath"
:controls="true"
enable-danmu
objectFit="cover"
:danmu-btn="false"
@play="playVideo(index)"
>
</video>
</view>
</view>
js代码文章来源地址https://www.toymoban.com/news/detail-518465.html
this.$http.Get(this.configFun.apiHome.studydataserch,parem).then(res => {
let data = res.content;
if(this.datalist.length < res.totalElements){
this.loadMore = true;
}else{
this.loadMore = false;
}
data.map(item => {
this.$set(item, 'pause', false);
})
this.datalist = this.datalist.concat(data);
})
pauseVideo(item) {
item.pause = true;
}
到了这里，关于解决微信小程序视频加载过多黑屏问题的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
