인프런 커뮤니티 질문&답변
작성한 질문수
커스텀 훅
작성
·
160
0
이 커스텀 훅 부분이 잘 이해가 안가서요..
재사용성을 위한것이라는 것과 중복을 줄였다는건 알겠는데
input에서 입력한 값들이 저기에 어떤식으로 들어가는건지 console.log로 찍어봐도 잘 이해가 안가요ㅠㅠ
제가 이해한걸 풀어보자면
input에서 changeId 등등 이벤트들이 발생하면 useInput()이 실행이 되고 실행될 때 useInput('') 이 매개변수로 input에서 입력한 값이 들어가고 useInput = (initValue = null) << 이부분에서 매개변수에 initValue가 처음엔 null이다가 이 부분에 input에서 입력한 값이 들어가서 useState를 실행하여 input에서 받아온 값을 setter로 해당하는 input란에 넣고 그 넣은 값을 henler에 저장하여 value와 함께 리턴해 주어서 value는 id에 handler는 onChangeId에 들어가는 게 맞는건가요?
여기에서 value, setter에 어떤값이 들어갈지 정확히 잘 모르겠어요..
답변 1
0
제로초(조현영)
지식공유자
원래
const [id, setId] = useState('');
const onChangeId = useCallback((e) => {
setId(e.target.value);
}, [])
이걸 useInput이라는 커스텀 훅으로 묶으셨다고 보시면 됩니다.
id -> value,
setId -> setter
onChangeId -> handler
로 이름이 바뀐 겁니다.