小程序视屏循环列表

先把视屏移除出来通过点击事来进行播放当前点击的视频

//同一个页面两个列表循环不同主题的视频
//第一个列表
<view class='life_center' wx:for="{{videolis}}" wx:for-item="videoitem" wx:key="videos">
    <view class='life_center_vid'>
    	<video id="{{'vide'+index}}" class='life_center_vid' wx:if="{{listnum == index}}" controls='true' autoplay='{{true}}'   src='{{videoitem.video}}'></video>
      	<view class='life_center_vid' style='display:{{listnum == index?"none":"block"}}'>
        	<image  class='life_center_vid' mode='aspectFill' src='{{videoitem.thumb}}'></image>
        	<text id="{{'vide'+index}}"  class='iconfont icon-bofang1 bofang' data-name="{{'vide'+index}}" data-idx="{{index}}"  bindtap='videoplay'></text>
      	</view>
    </view>
</view>
//第二个列表
<view class='life_center' wx:for="{{ailis}}" wx:for-item="ailisai" wx:key="videos">
    <view class='life_center_vid'>
    	<video id="{{index}}" class='life_center_vid' wx:if="{{listnums == index}}" controls='true' autoplay='{{true}}'   src='{{ailisai.video}}'></video>
      	<view class='life_center_vid' style='display:{{listnums == index?"none":"block"}}'>
        	<image  class='life_center_vid' mode='aspectFill' src='{{videoitem.thumb}}'></image>
        	<text id="{{index}}"  class='iconfont icon-bofang1 bofang'  data-idx="{{index}}"  bindtap='videoplay'></text>
      	</view>
    </view>
</view>

	data: {
	    listnum:"-1",
	    listnums:"-1",
	    modalHidden:false
 	 },
	videoplay(e) {
	    let id = e.currentTarget.id;
	    let name=e.currentTarget.dataset.name;
	    let idx = e.currentTarget.dataset.idx;
	    console.log(e)
	    console.log(id)
	    
	    if (id == name){
	      let vdieos = wx.createVideoContext(id);
	      vdieos.play();
	      this.setData({
	        listnum: idx,
	        listnums: -1,
	      });
	    }else{
	      let vdieo = wx.createVideoContext(id);//如果是一个页面只有一处视频列表循环直接用此写法
	      vdieo.play();
	      this.setData({
	        listnums: idx,
	        listnum: -1
	      });
	    }
	  },