原理: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>