react-router-dom의 hooks를 사용하여 경로를 설정해보자 사용할 hooks는 useHistory이다. 예제에서 링크를 버튼으로 만든 뒤, onClick 이벤트를 걸어서 경로를 변경시킬 것이다. import { useHistory } from "react-router-dom"; useHistory를 import 해준다. const history = useHistory(); history.push('/List')}>List 이동 버튼을 클릭 시 해당하는 컴포넌트로 이동하게 된다.

useEffect 를 사용 할 때에는 첫번째 파라미터에는 함수, 두번째 파라미터에는 의존값이 들어있는 배열 (deps)을 넣습니다. 만약에 deps 배열을 비우게 된다면, 컴포넌트가 처음 나타날때에만 useEffect 에 등록한 함수가 호출됩니다. useEffect(() => { console.log('처음 렌더링시에만 실행됨!!') }, []); 아래 예제와 같이 버튼을 클릭했을때 number의 값이 변화가 생길때에도 실행되게 해보겠습니다. import React, { useEffect, useState } from 'react'; const App = () => { const [number, setNumber] = useState(0); const increase = () => { setNumber(..

react hooks중 하나인 상태 관리 useState 사용하기 import React, { useState } from 'react'; const App = () => { const [number, setNumber] = useState(0); const increase = () => { setNumber(number+1); } const decrease = () => { setNumber(number-1); } return ( {number} +1 -1 ) } export default App