如何将音频引用发送到 React 中的函数？

Question

我有音频参考：

    const sound1 = useRef();

正如我所做的那样：

   <audio  ref={sound1} src='/resources/DRUMS.mp3' loop={looping}></audio>

以及我想将其发送至的函数：

const toggleMuteUnmute=(soundRef, isPlaying, stateFunc)=>{
    const prevValue = isPlaying;
    stateFunc(!prevValue);
    if(prevValue){
        soundRef.current.muted = false;
        animationRef.current = requestAnimationFrame(whilePlaying);
    }
    else{
        soundRef.current.muted = true;
        cancelAnimationFrame(animationRef.current);
    }
}

使用这个：

<button onClick={toggleMuteUnmute(sound1, isPlaying1, setIsPlaying1)} >

但出现错误：

Cannot set properties of undefined (setting 'muted')

引用 'else' 语句中的第一行。

为什么它无法读取 html 音频标签的静音属性？

Answer 1

好的，我解决了。我所要做的就是在函数调用之前放置 - () => ，如 -

<button onClick={() => toggleMuteUnmute(sound1, isPlaying1, setIsPlaying1)} >

如何将音频引用发送到 React 中的函数？

How can I send an audio reference to a function in React?

audio

reference

function

reactjs