How to play different sound effects using vuejs and @vueuse/sound?

Question

I'm struggling to understand how I can pass the name of a sound effect as a parameter to the play constant set in the setup and thus play the sound effect "button2" instead of "buttonSFX".

<script> import { useSound } from '@vueuse/sound' 
import buttonSfx from '../assets/button.mp3'
import button2 from '../assets/button2.mp3'

export default {   
setup() {
    const { play } = useSound(buttonSfx)
    return {
      play,
    }   
  }, 
} 
</script>

Answer 1

Here is how I got it to work

<script setup>
import { useSound } from '@vueuse/sound';
import plusSound from '@/assets/sounds/click-sound.mp3';
import minusSound from '@/assets/sounds/minus-click.mp3';

const plus = useSound(plusSound);
const minus = useSound(minusSound);

const increment = () => {
  plus.play()
 .....
}

const decrement = () => {
  minus.play()
 .....
}

</script>