微信小程序仿抖音上下滑动整屏切换视频

使用官网上面的扩展组件

https://developers.weixin.qq.com/miniprogram/dev/extended/component-plus/video-swiper.html
链接: link.

官方使用的方式：

视频源数量最少是3才能正常使用；

从第二个视频开始播放是为了保证后面算法的顺序，滚动到最后一个后会进入循环，这是为了在下滑往前滚动的时候也保证原来的顺序。

正确的用法是，先传入至少3个视频，当滚动的时候往后追加，尽量不要让未播放视频的数量少于3

可结合自己业务修改：

初始视频数量和追加视频数量最好还是3或者是3的倍数

video-list="{{videoList}}" 
bindchange="swiperchange"

data: {
    videoList:[
    {id:1,url:'https://test1.mp4'},
    {id:2,url:'https://test2.mp4'},
    {id:3,url:'https://test3.mp4'}],
    list:[{id:4,url:'https://test4.mp4'},
    {id:5,url:'https://test5.mp4'},
    {id:6,url:'https://test6.mp4'}]
  },

swiperchange(e){
    const that = this
     that.setData({
      videoList:that.data.videoList.concat(that.data.list)
    })
  },
},

设置每次进入视频都是重新开始播放

 playCurrent: function playCurrent(current) {
     this.data._videoContexts.forEach(function (ctx, index) {
	      ctx.seek(0)//重新开始播放
	     index !== current ? ctx.pause() : ctx.play();
     });
},