• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

렌더링 될 때마다 함수 새로 그려지는데 한 번 선언하고 계속 쓰면 안되는건가요:?

21.01.06 22:23 작성 조회수 99

0

 함수가 새로 그려지는게 useCallback 콜백 매개변수로 특정 값이 바뀔때마다 함수가 새로그려지는걸로 알 고 있습니다. 근데 예전부터 궁금했는데 한 번 그려놓은 함수를 계속 사용하면 되는거아닌가요? 왜 특정 값이 바뀔때마다 useCallback을 해서 새로 그려야 되는건가요? 그냥 [] 빈 배열 값 넣고 시작, 끝일때 실행되게 하면 문법상 에러인가요?

답변 2

·

답변을 작성해보세요.

2

const [name, setName] = useState('zerocho');

const onClick = useCallback(() => {
  console.log(name);
}, []);

이렇게 빈 배열만 넣은 경우에는

setName('nero'); 로 name을 변경할 때

console.log(name)이 여전히 zerocho로 나오게 됩니다.

이것을 nero로 나오게 수정하려면

const onClick = useCallback(() => {
  console.log(name);
}, [name]);

을 넣어야 합니다.

0

트릴님의 프로필

트릴

질문자

2021.01.07

함수를 새로 그리지 않으면 state값이 업데이트가 되지 않는거군요...  그럼 

const onClick = useCallback(() => {
  console.log(name);
}, []);

은 영원히  'zerocho' 값이군요...

전 onClick 이벤트를 하는 버튼이 함수를 호출하면 값이 바뀔거라고 생각하고 한 번만 선언하면 되지 않나 생각했는데.. 잘못생각했었네요..