小程序多视频播放,避免同时播放

小程序多视频播放,避免同时播放

html

<block wx:if="{{index_info.video != false}}">
<view class="tv">
    <view class="head1">
        <text class="one">动漫<text >说</text></text>
    </view>
    <view class="con">
        <view class="k"></view>
        <block wx:for="{{index_info.video}}" wx:key="id">
        <view class="list">
            <view class="TV">
                <video bindplay="bindPlayCallBack" id="video_{{item.id}}" style="width: 335rpx;height: 200rpx;" src="{{item.video_url}}" poster="{{item.img_url}}"></video>
            </view>
            <view class="word">{{item.title}}</view>
            <view class="fu">{{item.sub_title}}</view>
        </view>
        </block>
        <view class="p"></view>
        </view>
</view>
</block>

js

bindPlayCallBack: function (e) {
    console.log(‘当前视频‘, e.target.id);
    var current_video = e.target.id;
    // 获取所有的video
    console.log(‘所有视频‘, this.data.index_info.video);
    var that = this;
    let video = that.data.index_info.video;
    for (var i in video) {
        var index_video = ‘video_‘ + video[i].id;
        var videoContextPrev = wx.createVideoContext(index_video);
        if (current_video != index_video) {
            // 暂停其他的
            videoContextPrev.pause();
        }
    }
}

这里用到了,循环json数组的用法。

小程序多视频播放,避免同时播放

上一篇:对Linux 系统中yum源的理解


下一篇:签名小程序