<template>
<view>
<view class="video-box">
<video :show-loading="false" class="vid"
src="https://image-china-loading.oss-cn-chengdu.aliyuncs.com/static/guide.mp4"
:enable-progress-gesture="false" @ended="ended" object-fit="cover" autoplay
:controls="controls"></video>
</view>
</view>
</template>
<script>
export default {
data() {
return {
controls: true
}
},
onReady() {
// #ifdef APP
this.controls = false
// #endif
},
methods: {
ended() {
uni.redirectTo({
url: '/pages/index/index'
})
}
}
}
</script>
<style lang="scss">
.video-box {
width: 100vw;
height: 100vh;
.vid {
width: 100%;
height: 100%;
}
}
</style>
xiaoxin1212
- 发布：2025-07-24 15:57
- 更新：2025-07-24 16:00
- 阅读：186
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 11
HBuilderX类型： 正式
HBuilderX版本号： 4.75
手机系统： Android
手机系统版本号： Android 16
手机厂商： 小米
手机机型： K60
页面类型： vue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
App启动首页自动播放视频
App启动首页自动播放视频
预期结果：
等页面呈现才会自动播放视频
等页面呈现才会自动播放视频
实际结果：
点击App loading还在加载 声音已经出来了，等页面展示已经是视频的最后一帧了
点击App loading还在加载 声音已经出来了，等页面展示已经是视频的最后一帧了
bug描述：
点击App loading还在加载 声音已经出来了，等页面展示已经是视频的最后一帧了
xiaoxin1212 (作者)
这样不行，无法自动播放
2025-07-24 16:20
蔡cai
回复 xiaoxin1212: 通过uni.createVideoContext控制播放暂停呢，onLoad暂停视频，onReady播放视频
2025-07-24 16:24
xiaoxin1212 (作者)
回复 蔡cai: 偶尔还是会出现声音先出来页面没有出来，在首页的时候
2025-07-25 10:33
蔡cai
回复 xiaoxin1212: 把autoplay设置为false，onReady通过uni.createVideoContext播放视频，这样呢
2025-07-25 10:40
xiaoxin1212 (作者)
回复 蔡cai: autoplay默认是false，现在根据你的办法在onReady通过uni.createVideoContext播放视频，但是它好像取决于点击App加载的启动界面来决定，加载的久就有问题，加载的短就没有问题
2025-07-25 12:17
蔡cai
回复 xiaoxin1212: 有一个想法不知道行不行：video标签上加ref="video"，computed上添加一个getVideoInfo() { return this.$refs.video }，watch监听getVideoInfo，有值的时候执行播放
2025-07-25 13:43