Cannot update a component (`ForwardRef`) while rendering a different component (`Layer`). To locate the bad setState() call inside `Layer`, follow the stack trace as described in https://reactjs.org/link/setstate-in-render

const Layer = () => {
	return (
      <div onClick={setTxt(txt)}>
    )
}

이슈

엘리먼트에 onClick에서 바로 setState 값 저장했더니 위와 같은 에러 발생.

원인

원인은 onClick 이벤트 핸들러에 함수 호출을 직접 전달한 것 때문입니다.
이렇게 하면 컴포넌트가 렌더링될 때마다 함수가 즉시 실행됩니다.

해결

이를 해결하려면 onClick 이벤트 핸들러에 함수를 전달해야 합니다.

const Layer = () => {
 const handleClick = (txt) => {
   setTxt(txt)};
 }
 
	return (
     <div onClick={handleClick(txt)}>
   )
}