1. 播放器歌词效果

vite-tailwindcss/src/composables/useAudio.js

@@ -84,6 +84,28 @@ export function useAudio() {
     }
   }
 
+  const currentIndex = computed(() => tracks.value.findIndex((t) => t.url === activeUrl.value))
+
+  const playAt = (index) => {
+    const list = tracks.value
+    if (!list.length) return
+    const i = ((index % list.length) + list.length) % list.length
+    const url = list[i]?.url
+    if (!url) return
+    if (isPlaying.value) playUrl(url)
+    else setActive(url)
+  }
+
+  const prev = () => {
+    const idx = currentIndex.value
+    playAt(idx < 0 ? 0 : idx - 1)
+  }
+
+  const next = () => {
+    const idx = currentIndex.value
+    playAt(idx < 0 ? 0 : idx + 1)
+  }
+
   const play = () => playUrl(activeUrl.value)
 
   const attemptAutoplay = async () => {
@@ -154,8 +176,11 @@ export function useAudio() {
     currentTime,
     duration,
     volume,
+    currentIndex,
     setTracks,
     setActive,
+    prev,
+    next,
     play,
     pause,
     toggle,