Custom Hook 과 내장 훅

우리가 오늘(2022-4-26)에 만든 커스텀 훅

const useInput = (defaultValue) => {
    const [value, setValue] = useState(defaultValue)
    const onChange = e => {
        setValue(e.target.value)
    }
    return {
        value,
        onChange
    }
}

커스텀 훅은 최상위 코드에 호출해야한다.

 

 

 

 

 

Form 안에 있는 useEffect()는 기존 리액트에서 내장(미리 만들어놓은 ) 훅을 가져와 사용했다.

 

const Form = () => { 

useEffect(() => {

        if (submit) {
            console.log('나 회원가입 시켜줘')

            if (Object.keys(errors).length === 0) {
                alert(' 회원가입 성공적')
            }

            setTimeout(() => {
                setSubmit(false) //1초뒤에 회원가입 활성화
            }, 1000) //1초뒤에 회원가입 활성화 
        }
    }, [submit]
    )