🐞 fix: 修复播放暂停控制问题 后续优化为参数监听

This commit is contained in:
alger
2024-12-12 22:36:07 +08:00
parent cebf313075
commit 7365daf700
5 changed files with 10 additions and 1 deletions
+3
View File
@@ -15,6 +15,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { useStore } from 'vuex'; import { useStore } from 'vuex';
import { audioService } from '@/services/audioService';
const props = defineProps<{ const props = defineProps<{
show: boolean; show: boolean;
title: string; title: string;
@@ -29,6 +31,7 @@ watch(
if (val) { if (val) {
store.commit('setIsPlay', false); store.commit('setIsPlay', false);
store.commit('setPlayMusic', false); store.commit('setPlayMusic', false);
audioService.getCurrentSound()?.pause();
} }
}, },
); );
+2
View File
@@ -27,6 +27,7 @@ import { useStore } from 'vuex';
import { getAlbum, getListDetail } from '@/api/list'; import { getAlbum, getListDetail } from '@/api/list';
import MvPlayer from '@/components/MvPlayer.vue'; import MvPlayer from '@/components/MvPlayer.vue';
import { audioService } from '@/services/audioService';
import { IMvItem } from '@/type/mv'; import { IMvItem } from '@/type/mv';
import { getImgUrl } from '@/utils'; import { getImgUrl } from '@/utils';
@@ -75,6 +76,7 @@ const handleClick = async () => {
if (props.item.type === 'mv') { if (props.item.type === 'mv') {
store.commit('setIsPlay', false); store.commit('setIsPlay', false);
store.commit('setPlayMusic', false); store.commit('setPlayMusic', false);
audioService.getCurrentSound()?.pause();
showPop.value = true; showPop.value = true;
} }
}; };
+3
View File
@@ -54,6 +54,7 @@
import { computed, useTemplateRef } from 'vue'; import { computed, useTemplateRef } from 'vue';
import { useStore } from 'vuex'; import { useStore } from 'vuex';
import { audioService } from '@/services/audioService';
import type { SongResult } from '@/type/music'; import type { SongResult } from '@/type/music';
import { getImgUrl } from '@/utils'; import { getImgUrl } from '@/utils';
import { getImageBackground } from '@/utils/linearColor'; import { getImageBackground } from '@/utils/linearColor';
@@ -105,8 +106,10 @@ const playMusicEvent = async (item: SongResult) => {
if (playMusic.value.id === item.id) { if (playMusic.value.id === item.id) {
if (play.value) { if (play.value) {
store.commit('setPlayMusic', false); store.commit('setPlayMusic', false);
audioService.getCurrentSound()?.pause();
} else { } else {
store.commit('setPlayMusic', true); store.commit('setPlayMusic', true);
audioService.getCurrentSound()?.play();
} }
return; return;
} }
-1
View File
@@ -140,7 +140,6 @@ watch(
const throttledSeek = useThrottleFn((value: number) => { const throttledSeek = useThrottleFn((value: number) => {
if (!sound.value) return; if (!sound.value) return;
sound.value.seek((value * allTime.value) / 100); sound.value.seek((value * allTime.value) / 100);
store.commit('setPlayMusic', true);
}, 50); // 50ms 的节流延迟 }, 50); // 50ms 的节流延迟
// 修改 timeSlider 计算属性 // 修改 timeSlider 计算属性
+2
View File
@@ -43,6 +43,7 @@ import { useStore } from 'vuex';
import { getTopMv } from '@/api/mv'; import { getTopMv } from '@/api/mv';
import MvPlayer from '@/components/MvPlayer.vue'; import MvPlayer from '@/components/MvPlayer.vue';
import { audioService } from '@/services/audioService';
import { IMvItem } from '@/type/mv'; import { IMvItem } from '@/type/mv';
import { formatNumber, getImgUrl, setAnimationClass, setAnimationDelay } from '@/utils'; import { formatNumber, getImgUrl, setAnimationClass, setAnimationDelay } from '@/utils';
@@ -73,6 +74,7 @@ onMounted(async () => {
const handleShowMv = async (item: IMvItem, index: number) => { const handleShowMv = async (item: IMvItem, index: number) => {
store.commit('setIsPlay', false); store.commit('setIsPlay', false);
store.commit('setPlayMusic', false); store.commit('setPlayMusic', false);
audioService.getCurrentSound()?.pause();
showMv.value = true; showMv.value = true;
currentIndex.value = index; currentIndex.value = index;
playMvItem.value = item; playMvItem.value = item;