//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
                                        }

                                }
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐