[도서]실전 리액트 프로그래밍(3)

choiuhana·2021년 9월 24일
0

useMemo

const value = useMemo(()=> function(v1, v2), [v1, v2])

첫번째 매개변수로 함수, useMemo가 반환값을 기억한다.
배열의 값이 변경되지 않으면 기억한 반환값을 재사용

useCllback

//자식 컴포넌트에 함수와 props를 내려줄 경우

const [name, setName] = useState('')
const [age, setAge] = useState(0)

...

<UserEdit 
	onSave={()=> saveToSever(name, age)}
    ... />

// useCallback 사용

const onSave = useCallback(()=> saveTosever(name, age), [name, age])

... 

<UseEdit
	onSave={onSave}
	... />

useMemo가 함수의 리턴을 저장한다면 useCallback은 함수를 저장, 마찬가지로 배열의 값이 변경되지 않는다면 그대로 사용.

profile
만드는 사람도 사용하는 사람도 편하고 만족하는 '것'을 추구하는 프론트엔드 개발자

0개의 댓글