首页 > 微信 > 详细

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

时间:2020-06-03 22:46:08      阅读:94      评论:0      收藏:0      [点我收藏+]

技术分享图片

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数组的用法。

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

原文:https://www.cnblogs.com/jiqing9006/p/13040182.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!