• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

小程序播放当前视频,其他所有视频暂停

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

原理:1.点击当前视频,先判断是否有视频正在播放,如果没有,立即播放,如果有,则暂停其他视频,再播放当前视频

data: {
    indexCurrent: null,
  },
methods: {
    // 只播放一个视频,其他视频暂停
    video_play(e) {
      var curIdx = e.currentTarget.id;
      // 没有播放时播放视频
      // console.log(curIdx)
      if (!this.data.indexCurrent) {
        this.setData({
          indexCurrent: curIdx
        })
        var videoContext = wx.createVideoContext(curIdx, this) //这里对应的视频id
        videoContext.play()
      } else { // 有播放时先将prev暂停,再播放当前点击的current
        var videoContextPrev = wx.createVideoContext(this.data.indexCurrent, this)//this是在自定义组件下,当前组件实例的this,以操作组件内 video 组件(在自定义组件中药加上this,如果是普通页面即不需要加)
        if (this.data.indexCurrent != curIdx) {
          console.log(123)
          videoContextPrev.pause()
          this.setData({
            indexCurrent: curIdx
          })
          var videoContextCurrent = wx.createVideoContext(curIdx, this)
          videoContextCurrent.play()
        }
      }
    },

WXML

<video  bindtap="video_play" id="{{item.sid}}" poster="{{item.thumbnail}}" auto-pause-if-open-native wx:elif="{{item.type==\'video\'}}" src="{{item.images}}" src="{{item.video}}"></video>

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
小程序使用ECharts步骤发布时间:2022-07-18
下一篇:
微信小程序单选按钮最佳发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap