一只小欧追
一只小欧追
  • 发布:2020-04-29 12:36
  • 更新:2020-04-29 12:36
  • 阅读:1131

【报Bug】app端nvue下正在加载的视频调用pause方法失效

分类:uni-app

详细问题描述

(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)

[内容]app端nvue下正在加载的视频调用pause方法后,@timeupdate不执行但是视频还在播放

重现步骤

[步骤]nvue下循环多个视频组件,每隔一秒播放下一个视频,并且暂停上一个视频

[结果]有的视频并不会暂停

[期望]之前的视频暂停

[如果语言难以表述清晰,拍一个视频或截图,有图有真相]

IDE运行环境说明

HBuilderX

[IDE版本号]
2.6.11.20200409
[windows版本号]
window10
[mac版本号]

uni-app运行环境说明

运行端app

[运行端版本号]

项目是HBuilderX创建的

编译模式说明:v3模式

App运行环境说明

[Android版本号]
安卓10
[iOS版本号]

[手机型号]
红米k20pro
[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

父组件  

<template>  
  <view class="videolist">  
   <videodemo v-for="(item,index) in videolist" :key="index" :src="item.url" :ref="'video' + index"></videodemo>  
    <button type="default" @tap="startplay">开始</button>  
  </view>  
</template>  

<script>   
import videodemo from "../../components/videodemo/videodemo.vue"  
  export default {  
    data() {  
      return {  
        videolist: [],  
        videoindex: 0,  
        videoindex1: 0,  
        time:''  
      }  
    },  
    components:{  
      videodemo  
    },  
    watch:{  
      videoindex(val){  
        var str = 'video' + val  
        var str1 = 'video' + this.videoindex1  
        this.$refs[str1][0].stopplay()  
        this.$refs[str][0].startplay()  
        this.videoindex1 = val  
      }  
    },  
    onLoad() {  
      uni.request({  
        url: "http://www.xiaoouzhui.top/videolist.php",  
        success: (res) => {  
          this.videolist = res.data  
          this.$nextTick(() => {  
            var str = 'video' + this.videoindex  
            this.$refs[str][0].startplay()  
          })  
        }  
      })  
    },  
    methods: {  
      startplay() {  
        this.videoindex = 0  
        this.time = setInterval(() => {  
          if(this.videoindex > 10){  
            clearInterval(this.time)  
          }  
          this.videoindex++  
        },1000)  
      }  
    },  
  }  
</script>  

<style>  
  .videolist {  
    flex-direction: row;  
    flex-wrap: wrap;  
    justify-content: space-between;  
  }  

</style>  

子组件  

<template>  
    <view>  
        <video :src="src" id="videodemo" controls class="myvideo" @timeupdate="videoing"></video>  
    <text>{{status}}</text>  
    <text>{{videotime}}</text>  
    </view>  
</template>  

<script>  
    export default {  
    props:{  
      src:{  
        type:String  
      }  
    },  
        data() {  
            return {  
                myvideo:null,  
        status:'未开始',  
        videotime:0  
            };  
        },  
    created() {  
      this.myvideo = uni.createVideoContext('videodemo',this)  
    },  
    methods:{  
      startplay(){  
        this.myvideo.play()  
        this.status = "播放"  
      },  
      stopplay(){  
        this.myvideo.pause()  
        this.status = "暂停"  
      },  
      videoing(e){  
        this.videotime = e.detail.currentTime  
        console.log(e.detail.currentTime);  
      }  
    }  
    }  
</script>  

<style>  
.myvideo {  
    width: 240rpx;  
    height: 150rpx;  
    margin: 2rpx;  
  }  
</style>  

联系方式

[QQ]1144243934@qq.com

2020-04-29 12:36 负责人:无 分享
已邀请:

该问题目前已经被锁定, 无法添加新回复