我正在嘗試在 Vue 3 Composition API 中設定一個基本按鈕單擊以觸發聲音效果。目前，我的設定函式包括從 assets 檔案夾匯入的 mp3 音效，然后傳遞給 HTMLAudioElement 型別的 ref 方法，然后分配給名為“play”的 const。在將“播放”常量添加到回傳后，我將“播放”添加到按鈕中的單擊處理程式中。我在控制臺中沒有收到錯誤，但按鈕仍然沒有觸發音效。如何配置設定功能和按鈕以觸發音效？這是我的代碼：
<template>
<div div class="flex justify-center">
<button @click="play">Click</button>
</div>
</template>
<script>
import { ref } from 'vue'
import { trumpetSfx } from '../assets/demo_src_assets_fanfare.mp3'
export default {
name: 'Button',
components: {},
setup() {
const play = ref<HTMLAudioElement>(trumpetSfx);
return { play }
}
}
</script>
uj5u.com熱心網友回復：
您可以Audio直接從 javascript 使用 API：
import trumpetSfx from '../assets/demo_src_assets_fanfare.mp3'
...
setup() {
const audio = new Audio(trumpetSfx);
function play() {
audio.play()
}
return { play }
}
...
uj5u.com熱心網友回復：
const trumpetSfx = require("../assets/demo_src_assets_fanfare.mp3");
export default {
setup() {
const audio = new Audio(trumpetSfx);
const handleClick = () => {
audio.play()
}
return { audio, handleClick }
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/417283.html
標籤：
上一篇：用于更改背景顏色的深度選擇器
下一篇：為什么表單總是回傳無效？