2***@qq.com
2***@qq.com
  • 发布:2024-06-27 15:49
  • 更新:2024-06-27 15:49
  • 阅读:12

【报Bug】video @ended不执行的问题

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: 11

HBuilderX类型: 正式

HBuilderX版本号: 4.14

手机系统: Android

手机系统版本号: Android 10

手机厂商: 华为

手机机型: nova 12

页面类型: vue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

<template>
<view>
<title-view title="课程详情"></title-view>
<view style="background-color: #ffffff">
<video autoplay @timeupdate="timeupdate" @ended="endStudy('end')" style="width: 100%" id="myVideo" :src="videoUrl"
controls></video>
<view>
<u-tabs @change="changeCurrentabs" lineColor="#222323" :list="trainListTabs"></u-tabs>
</view>
</view>
<view style="padding: 0 12px">
<view v-if="currentTab=='list'">
<view :style="{color:item.id==chooseVideoId?'#55aaff':(isSeeVideo(item)?'#c5c5c5':'#000000')}" @click="choseVideo(item)" v-for="(item,index) in videoList" style="margin-top: 10px;padding: 15px 15px;background-color: #ffffff;display: flex;align-items: center;justify-content: space-between">
<view style="font-size: 13px">
[{{index+1}}]<text>{{item.title}}</text>
</view>
<view style="font-size: 13px">
<text>{{item.totalDuration?new Date(item.totalDuration*1000).format('mm:ss:qq'):"00:00:00"}} </text>
<image mode="widthFix" style="width: 10px;height: 10px"></image>
</view>
</view>
</view>
<view v-if="currentTab=='introduct'" style="margin-top: 10px">
<view style="font-size: 12px">
<view v-if="trainingId" style="background-color: #ffffff;padding: 13px 10px;display: flex;justify-content: space-between;align-items: center;border-radius: 10px">
<view>
{{exerciseTitle}}
</view>
<view @click="handleConfirmInfo" style="background-color: #ffffff;border: 1px solid #d9ecff;color: #3e9ffd;padding: 5px 10px;border-radius: 5px">
开始测试
</view>
</view>
<view style="background-color: #ffffff;padding: 13px 10px;margin-top: 10px;">
<view style="font-size: 14px;font-weight: bold;margin-bottom: 10px">
屠场日常规范教程
</view>

       <view style="color: #8a8a8a;line-height: 21px">  
         {{remarks}}  
       </view>  

     </view>  
   </view>  
 </view>  

</view>  
</view>  

</template>

<script>
import TitleView from '@/components/titleView.vue'
import { getCourseDetail, getVideoHistroyList, putEndStudy } from '../../common/api/course/courseDetail'
import { replaceUrl, showToast } from '../../common/utils/methods'
export default {
components: {
TitleView
},
data() {
return {
trainListTabs:[{
name:'课程目录',
value:'list'
},{
name: '课程简介',
value:'introduct'
}],
currentTab:'list',
courseId:null,
videoList:[],
remarks:'',
exerciseTitle:'',
trainingId:null,
videoUrl:'',
initialTime:0,
histroyVideoList:[],
videomessage:null,
learningDuration:0,
chooseVideoId:null
}
},
onUnload () {
this.endStudy()
},
onLoad(option){
this.courseId=option.courseId
if(option.trainingId){
this.trainingId=option.trainingId
}
this.videoHistroyList()
this.courseDetailMessage()
},
methods: {
isSeeVideo(videoMessage){
let flag=false
this.histroyVideoList.forEach(item=>{
if(item.detailsId==videoMessage.id){
if(item.isFinish){
flag=true
}
}
})
return flag
},
choseVideo(videoMessage){
this.chooseVideoId=videoMessage.id
let initTime=null
this.videomessage=videoMessage
this.histroyVideoList.forEach(item=>{
if(item.detailsId==videoMessage.id){
initTime=parseInt(item.learningDuration)
}
})
this.videoUrl=replaceUrl(videoMessage.url)
// this.videoUrl="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4"
},
handleConfirmInfo(){
uni.navigateTo({
url:/pages/examination/confirmInfo?trainingId=${this.trainingId}
})
},
videoHistroyList(){
getVideoHistroyList({
trainingId:this.trainingId
}).then(res=>{
this.histroyVideoList=res.data
}).catch(error=>{
showToast(error.msg)
})
},
courseDetailMessage(){
getCourseDetail(this.courseId).then(res=>{
this.videoList=res.data.detailsList
const {remarks,exerciseTitle}=res.data
this.remarks=remarks
this.exerciseTitle=exerciseTitle
}).catch(error=>{
showToast(error.msg)
})
},
changeCurrentabs(e){
this.currentTab=e.value
},
timeupdate(e){
this.learningDuration=e.detail.currentTime
},
endStudy(type){
putEndStudy(
{
trainingId:this.trainingId,
detailsId:this.videomessage.id,
learningDuration:this.learningDuration,
isFinish:type=='end'?1:0,
remarks:''
}
).then(res=>{
this.courseDetailMessage()
this.chooseVideoId=null
this.videoHistroyList()
})
},
}
}
</script>

<style scoped lang="scss">

</style>

操作步骤:

当视频播放结束后endStudy函数是没执行的

预期结果:

endStudy函数执行

实际结果:

endStudy函数执行没有执行

bug描述:

video 播放路经的http的ip地址会出现@ended没有触发和播放按钮会出现播放和暂停频分触发 路径如:http://192.168.3.203:8088/admin/sys-file/rongchang-pig/ff2712ba089f4bbbb85fe6c53d2b4a54.mp4

2024-06-27 15:49 负责人:无 分享
已邀请:

要回复问题请先登录注册