diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 928f538..8a3dcd5 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -179,21 +179,6 @@ export default function HomePage() { setcurrentTime(audio.currentTime) }) - audio.addEventListener('ended', () => { - setisPlay(false) - console.log("🚀 ~ audio.addEventListener ~ playMode:", playMode, listIndex) - if(playMode === 0){ - if(listIndex < musicList.length - 1){ - setlistIndex(listIndex + 1) - }else{ - setlistIndex(0) - } - videoRef.current.currentTime = 0 - }else if(playMode === 1){ - videoRef.current.currentTime = 0 - } - }) - audio.addEventListener('pause', () => { setcurrentTime(audio.currentTime) }) @@ -258,34 +243,38 @@ export default function HomePage() { }) }) } - - }) } - }, [listIndex]) - + useEffect(() => { + const audio = videoRef.current + if (audio) { + audio.addEventListener('ended', endedHandle); + } + + return () => { + if (audio) { + audio.removeEventListener('ended', endedHandle); + } + }; + }, [listIndex, playMode]) const timeupdateHandle = () => { setcurrentTime(videoRef.current.currentTime) } const endedHandle = () => { - // setisPlay(false) - console.log("🚀 ~ audio.addEventListener ~ playMode:", playMode, typeof playMode) - // debugger - if (playMode === 0) { - if(listIndex < musicList.length - 1){ - setlistIndex(listIndex + 1) - }else{ - setlistIndex(0) + console.log("🚀 ~ audio.addEventListener ~ playMode:", playMode, listIndex) + if(playMode === 0){ + setisPlay(false) + if(listIndex < musicList.length - 1){ + setlistIndex(listIndex + 1) + }else{ + setlistIndex(0) + } + videoRef.current.currentTime = 0 } - audioAddEvent() - } else if (playMode === 1) { - videoRef.current.currentTime = 0 - videoRef.current.play() - } } const playHandle = () => { @@ -351,7 +340,7 @@ export default function HomePage() { /> - +
setplayMode(playMode ? 0 : 1)} + onClick={() => setplayMode(m => m ? 0 : 1)} >