监听视频进度,完成视频试看功能

<video :src="class_info.video_audio_url" id="myVideo" :poster="imgurl" @timeupdate="videoTimeUpdateEvent"></video>
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);
    }
},

 

posted on 2022-01-12 10:47  天空中的云~飞起来了  阅读(611)  评论(0)    收藏  举报