Преглед на файлове

fix: 修复播放器切换书籍后音频时间不更新的问题

- audio.ts play() 添加 duration/currentTime 重置逻辑
- player/index.vue 添加 onShow 刷新音频状态
- 解决退回后再切换书籍时音频时间显示旧值的问题

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
MyFramework User преди 3 месеца
родител
ревизия
a1eb707692
променени са 2 файла, в които са добавени 20 реда и са изтрити 1 реда
  1. 16 1
      my-uniapp-vue3/src/pages/player/index.vue
  2. 4 0
      my-uniapp-vue3/src/store/audio.ts

+ 16 - 1
my-uniapp-vue3/src/pages/player/index.vue

@@ -190,7 +190,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onMounted, onUnmounted } from 'vue';
+import { ref, computed, onMounted, onUnmounted, onShow } from 'vue';
 import { useAudioStore } from '../../store/audio';
 import { get, put, getFullUrl } from '../../utils/request';
 import type { AudioItem } from '../../types';
@@ -323,6 +323,21 @@ onMounted(async () => {
   }
 });
 
+// 页面显示时刷新音频状态
+onShow(() => {
+  // 刷新 store 中的当前音频信息
+  if (audioStore.currentAudio) {
+    audio.value = audioStore.currentAudio;
+    // 同步进度条
+    if (audioStore.currentTime > 0) {
+      currentTime.value = audioStore.currentTime;
+    }
+    if (audioStore.duration > 0) {
+      duration.value = audioStore.duration;
+    }
+  }
+});
+
 // 页面卸载
 onUnmounted(() => {
   // 清除睡眠定时器

+ 4 - 0
my-uniapp-vue3/src/store/audio.ts

@@ -112,6 +112,10 @@ export const useAudioStore = defineStore('audio', () => {
   function play(audio: AudioItem) {
     initAudioContext();
 
+    // 重置时长,避免切换书籍后显示旧时长
+    currentTime.value = 0;
+    duration.value = 0;
+
     currentAudio.value = audio;
 
     // 获取完整的音频 URL