김장현
2 years ago
4 changed files with 71 additions and 5 deletions
Binary file not shown.
@ -0,0 +1,24 @@
|
||||
import { useMemo, useEffect, useState } from 'react'; |
||||
|
||||
const useAudio = url => { |
||||
const audio = useMemo(() => new Audio(url), []); |
||||
const [playing, setPlaying] = useState(false); |
||||
|
||||
const toggle = val => setPlaying(val); |
||||
|
||||
useEffect(() => { |
||||
if (playing) audio.loop = true; |
||||
playing ? audio.play() : audio.pause(); |
||||
}, [playing]); |
||||
|
||||
useEffect(() => { |
||||
audio.addEventListener('ended', () => setPlaying(false)); |
||||
return () => { |
||||
audio.removeEventListener('ended', () => setPlaying(false)); |
||||
}; |
||||
}, []); |
||||
|
||||
return [playing, toggle]; |
||||
}; |
||||
|
||||
export default useAudio; |
Loading…
Reference in new issue