[React] 에러 : Too many re-renders.

 

useState의 값을 변경할 때 Too many re-renders이 뜬다.

특히 onClick 안에서 useState의 값을 변경할 때 뜬다.

 

//모달 온오프
let [modal, setModal] = useState(false);

...

{
	questionNumber==1 && 
    <input placeholder="여기를 눌러주세요"
    value={value}
    className={style.answer_text}
	readonly
	onClick={setModal(true)}
	/>
}

예를 들어 이렇게 setModal을 true로 변경해주려고 한다.

나는 그냥 onClick안에 함수만 써준 격이다... 제대로 양식을 지켜 써줘야 무한 렌더링 오류가 안난다.

 

기본 js에선 onClick(()=>{~~})이렇게 써줬을텐데 그와 비슷하게 아래처럼 써주면 된다.

onClick={()=>{setModal(true)}}

이렇게 써주면 된다 ^^