话不多少直接上代码,需要注意的是,视频默认自动播放,获取到视频时候立马暂停视频
HTML代码
<template>
<view>
<video id="myVideo" class="video" src="您的视频地址" autoplay @timeupdate='video_time_update'></video>
</view>
</template>
JS代码
export default {
data() {
return {
video_time_update_status: true,
};
},
methods: {
// 播放进度变化时触发
video_time_update(e) {
// e.detail.duration 为视频总长度,在没有加载到视频的时候总长度为 -0.0001
// 当获取到视频长度后进入if
if (this.video_time_update_status && e.detail.duration > 0) {
// 第一次进入if 关闭更新状态,防止循环暂停
this.video_time_update_status= false;
// 获取视频
let videoContext = uni.createVideoContext('myVideo');
// 暂停视频
videoContext.pause();
}
}
},
}