如何根据path_15是否为空控制按钮的显示与隐藏？

直接通过Vue的条件渲染指令，就能实现当path_15为空时隐藏按钮的需求，同时建议优化播放函数避免无效操作：

1. 修改按钮代码，添加条件判断 #

在按钮标签上加入v-if或v-show指令，判断currentTrack.path_15是否有效（存在且不为空字符串）：

<button 
  class="mr-2 border border-[#fff] p-2 hover:bg-[#5a5a5a] hover:bg-opacity-50 rounded-lg text-xs" 
  @click="useSong.loadSong_15()"
  v-if="currentTrack && currentTrack.path_15 && currentTrack.path_15.trim()"
>15s</button>

• 用v-if：会直接从DOM中移除/添加按钮元素，适合不需要频繁切换显示的场景
• 用v-show：仅通过CSS控制显示隐藏，按钮始终留在DOM中，适合需要频繁切换的场景

2. 优化播放函数，避免空路径报错 #

在loadSong_15函数开头增加判断，防止传入空路径导致播放失败：

loadSong_15(){
    // 先校验path_15是否有效，无效则直接退出
    if (!this.currentTrack?.path_15?.trim()) {
        return;
    }

    if (this.audio && this.audio.src) {
        this.audio.pause()
        this.isPlaying = false
    }
    this.audio = new Audio()
    this.audio.src = this.currentTrack.path_15
    setTimeout(() => {
        this.isPlaying = true
        // 捕获播放失败的异常，避免控制台报错
        this.audio.play().catch(err => {
            console.error('播放失败:', err)
            this.isPlaying = false
        })
    }, 200)
},

内容的提问来源于stack exchange，提问作者jeanpegg