해결됨
프로젝트로 쉽게 배우는 Svelte(SvelteKit + Supabase)
$(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시 메모리 관련
영상 마지막 로직에 대해 질문드리려고 문의드립니다.onMount와 onDestory 함수로 setInterval과 clearInterval을 생명주기에 맞게 실행시키게되어 setInerval과 clearInterval을 한번씩만 실행시키는 거 같은데 $(리액티브선언문) 으로 setInterval과 clearInterval 를 작성 시setInterval과 clearInterval이 반복적으로 호출되어 생성되었다 지웠다 하는것 같아 보이는데이 방식이 메모리 영역에서 괜찮은건지 궁금합니다!<script>
let intervalEventText;
let eventIndex = 0;
const eventText = [
"영화 정보 업데이트",
"신규 영화 추가",
"이벤트 진행중"
]
import { onMount, onDestroy } from 'svelte'
/** 리액티브 선언문 방식 */
$: {
// 이벤트 인터벌 제거
clearInterval(intervalEventText);
console.log(eventIndex)
// 일정 시간 경과 후 eventIndex를 1 증가
intervalEventText = setInterval(() => {
eventIndex += 1;
if (eventIndex >= eventText.length) {
eventIndex = 0;
}
}, 1000);
}
/** onMount & onDestory 방식 */
// onMount(()=>{
// intervalEventText = setInterval(() => {
// eventIndex += 1;
// if (eventIndex >= eventText.length) {
// eventIndex = 0;
// }
// }, 1000);
// });
// onDestroy(()=>{
// console.log(eventIndex)
// clearInterval(intervalEventText);
// })
</script>
<p>{eventText[eventIndex]}</p>