fix(metronome): 视频加载排错与初始化兼容性

针对开发者工具/老基础库下视频卡加载圈的问题:

- 去掉 video 标签上的 :playback-rate 属性绑定
  (部分基础库初始化时设非 1.0 速率会导致首帧解码失败/卡死)
- 改在 @loadedmetadata 元数据加载完后再调用 videoCtx.playbackRate API
  这样视频先以 1.0 原速播放,确认 ready 后再调速,兼容性更好
- 新增 @error 事件监听,失败时 console + toast 提示
  便于诊断真机/工具的差异表现

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-05-25 16:31:45 +08:00
co-authored by Cursor
parent 867a6a97cf
commit 82c4d7e0a2
+19 -1
View File
@@ -36,7 +36,6 @@
:muted="true"
:loop="true"
:autoplay="true"
:playback-rate="playbackRate"
:show-controls="false"
:show-fullscreen-btn="false"
:show-play-btn="false"
@@ -44,6 +43,8 @@
:enable-progress-gesture="false"
:show-mute-btn="false"
object-fit="contain"
@error="onVideoError"
@loadedmetadata="onVideoLoaded"
/>
</view>
</view>
@@ -157,6 +158,23 @@ onMounted(() => {
setTimeout(() => videoCtx?.pause(), 50)
})
const onVideoError = (e: any) => {
console.error('[runner-video] error:', e?.detail || e)
uni.showToast({
title: '视频加载失败,请用真机预览',
icon: 'none',
duration: 2500,
})
}
const onVideoLoaded = (e: any) => {
console.log('[runner-video] metadata loaded:', e?.detail)
/* 元数据加载完后再设 playbackRate,部分基础库初始化时设非 1.0 会卡 */
try {
videoCtx?.playbackRate?.(playbackRate.value)
} catch (_) {}
}
/* 节拍器状态变化 → 同步视频播放/暂停 */
watch(isPlaying, (playing) => {
if (playing) {