前端監聽視頻播放進度,在試看結束后做一些操作

HTML

<video :src="class_info.video_audio_url"id="myVideo":poster="imgurl" @timeupdate="videoTimeUpdateEvent"> </video>

JavaScript

data() {return {videoContext: {}, // 用于綁定視頻標簽} }, created() {// 創建視頻實例指向視頻控件this.videoContext = uni.createVideoContext('myVideo'); }, videoTimeUpdateEvent(e) { // 播放進度改變// e.detail.currentTime為每次觸發時,視頻的當前播放時間let currentTime = Number(e.detail.currentTime);console.log('播放進度條改變', currentTime)// 試看結束 this.class_info.freed_time為試看時間if (currentTime >= this.class_info.freed_time) {// 試看結束,在這做一些想做的操作,例如停止視頻播放this.videoContext.exitFullScreen();this.videoContext.pause();this.videoContext.seek(0);} },

總結

以上是生活随笔為你收集整理的uniapp视频试看功能的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。