useNavigate, useLocation, useParams

useNavigate

• useNavigate 훅은 페이지 이동시키는 함수 자체를 반환해준다. 실행은 아님
• 특정 변수에 할당하면 해당 변수는 이름이 정의된 함수가 된다

const navigate = useNavigate();
const move = () => {
  navigate(이동할곳)
}

• parameter 로 특정 url 주소를 입력하면 해당 url 페인지로 이동하는 기능이 실행된다

useLocation

• 실행하면 경로 정보를 담고 있는 객체를 반환한다
• 해당객체를 변수에 할당하여 사용해준다
• 객체에서 pathname은 현재 경로의 값, search는 현재 경로의 query parameter의 값이다

const location = useLocation();

useParams

• 실행하면 Path parameter 정보를 담고 있는 객체를 반환한다
• 변수에 선언한 뒤 출력해보면 라우터에 등록해준 path parameter 정보를 담고있는 객체를 반환한다

const params = useParams();

---

정리

1. useNavigate 는 url 을 변경하는 함수를 반환한다
2. useLocation 는 현재 경로 정보를 담고 있는 객체를 반환한다
3. useParams 는 라우터에 등록한 path parameter 정보를 담고 있는 객체를 반환한다