uni-app video监听播放时长,可打卡、付费等功能、拖拽时间无效

10 篇文章 0 订阅
//template
<video class="vide" :src="urls" controls="controls" autoplay=true  @timeupdate='timeupdate'></video>
//data
                           currentTime: '', //记录当前时间
                           dragTime: '', //拖拽进度
                           flag: true, //第一次进入缓存
                           isSubmit: false, //是否提交
                           isHasTime: 20 //默认时长
//methods
timeupdate(e) {
                                var currentTime = Number(e.detail.currentTime.toFixed(2))
                                if (this.flag) {
                                        this.currentTime = currentTime
                                        this.flag = false
                                        console.log('第一次进入缓存--记录页面刷新缓存的时长');
                                } else {
                                        if (!this.isSubmit) {
                                                console.log(currentTime, 'currtent');
                                                let dis = currentTime - this.currentTime
                                                if (Math.abs(dis) > 1) {
                                                        let dragTime = currentTime - this.currentTime
                                                        this.currentTime = currentTime
                                                        console.log(this.currentTime, '>2 this.cuttt');
                                                        console.log(currentTime, '>2 currentTime');
                                                        this.dragTime == '' ? (this.dragTime = dragTime) : (this.dragTime = Number(this.dragTime) + Number(dragTime))
                                                        console.log('您快进来--' + dragTime + '---');
                                                        return
                                                } else {
                                                        this.currentTime = currentTime
                                                        if (this.dragTime.length == 0) {
                                                                this.dragTime = 0
                                                        }
                                                        if (this.dragTime < 0) {
                                                                console.log('左边-----拖拽');
                                                                let lls = this.currentTime - currentTime
                                                                if (this.currentTime + lls > this.isHasTime) {
                                                                        console.log('打卡~');
                                                                        return
                                                                        this.isSubmit = false
                                                                }
                                                                return
                                                        } else {
                                                                if (this.currentTime - this.dragTime > this.isHasTime) {
                                                                        console.log(this.currentTime, 'this.currentTime-end');
                                                                        console.log(this.dragTime, 'this.dragTime-end');
                                                                        console.log('打卡!');
                                                                        this.isSubmit = true
                                                                        return
                                                                }
                                                        }
                                                }
                                        } else {
                                                return
                                        }

                                }
  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值