Update index.tsx

src/views/music/music-detail/index.tsx

@@ -70,6 +70,7 @@ export default defineComponent({
     const footers = ref(null)
     const heightInfo = ref<any>('0')
     const musicDetail = ref<any>(null)
+    const audioFileUrl = ref('')
     const showImg = ref<string>('')
     const accompanyUrl = ref<string>('')
 
@@ -100,6 +101,12 @@ export default defineComponent({
             state.platformType === 'TEACHER' ? '/api-teacher' : '/api-student'
         })
         musicDetail.value = res.data
+
+        // 取原音，如果有多个则默认第一个
+        const background = res.data.background
+        audioFileUrl.value =
+          background && background.length > 0 ? background[0].audioFileUrl : ''
+
         showImg.value = res.data.musicImg || ''
 
         if (!showImg.value) {
@@ -257,7 +264,7 @@ export default defineComponent({
       heightInfo.value = height + footer.height
 
       // 初始化音频
-      if (musicDetail.value?.audioFileUrl) {
+      if (audioFileUrl.value) {
         initAudio()
       }
     })
@@ -561,7 +568,7 @@ export default defineComponent({
               )}
 
               <div class={styles.videoOperation}>
-                {musicDetail.value?.audioFileUrl && (
+                {audioFileUrl.value && (
                   <>
                     {!buyState.value.play && (
                       <div class={[styles.audition]}>
@@ -572,10 +579,7 @@ export default defineComponent({
 
                     <div class={[styles.audio, styles.collectCell]}>
                       <audio id="player" controls ref={audio}>
-                        <source
-                          src={musicDetail.value?.audioFileUrl}
-                          type="audio/mp3"
-                        />
+                        <source src={audioFileUrl.value} type="audio/mp3" />
                       </audio>
                     </div>
                   </>