首页 > 解决方案 > 无法在 React.js 中设置哔声

问题描述

我想在我的 React.js 应用程序中设置哔声。我关注了这篇文章,但是尽管我单击了按钮,但它却没有发出声音。

import UIfx from "uifx";

class App extends Component {
  render() {
    const mp3file = `${process.env.PUBLIC_URL}/assets/sound/alert.mp3`;
    const sound = new UIfx({ asset: mp3file });
    sound.setVolume(0.8);
    console.log("sound", sound);
    return() {
        <button onClick={sound.play}>Signup</button>
    }
  }
}

声音表演是这样的:

UIfx {file: {…}, volume: 0.8, throttleMs: 0, play: ƒ, setVolume: ƒ, …}
play: ƒ (volume)
setVolume: ƒ (volume)
file: {asset: "/assets/sound/alert.mp3"}
volume: 0.8
throttleMs: 0
validateVolume: ƒ validateVolume(volume)
__proto__: Object

我在下面有一个错误:

未捕获的错误:“音量”必须是介于 0.0 和 1.0 之间的数字

标签: javascriptreactjs

解决方案


哦,这是一个微妙的!

请注意,记录的sound对象表明该play函数采用名为volume:的参数play: ƒ (volume)。请记住,onClick将事件作为参数传递。所以既然直接传递了play函数,其实就相当于onClick={e => sound.play(e)}

尝试以下操作:

return() {
  <button onClick={() => sound.play()}>Signup</button>
}

推荐阅读