微信小程序视频列表用到的组件是 video
链接 https://developers.weixin.qq.com/miniprogram/dev/component/video.html
先附上效果图(对比效果)



大致思路就是,wx:for="{
{ videoLlist }}"下三个view,一个视频video,另一个封面image(客户需求,要可以自定义封面)。
主要控制变量是playIndex,当点击封面时赋予当前点击的e.currentTarget.id,而id="{
{ index }}"(index是微信wx:for自带的)。
在video加个wx:if,playIndex == index是判断条件,也就是说点击封面,对应的video的wx:if=true会渲染。
这时最好设置一个延迟来执行videoContext.play(),因为video渲染需要时间,无延迟的话还没渲染完play()就执行了。
其他video的wx:if=false(因为只有要播放的video渲染,而其他video不渲染,所以视频列表不会卡顿)
代码很挫,希望能帮到人
wxml:
<!--pages/activity/historyList/historyList.wxml-->
<view class='bg_graye' style='w