Route States

페이지가 넘어갈 때, 데이터도 같이 넘겨주기

페이지 이동할 때 react-router-dom 라이브러리를 사용한다.
그런데 이렇게 페이지를 이동할 때 같이 들고 가고 싶은 데이터가 있을 수 있다.
redux등을 사용하면 언제든지 꺼내쓸 수 있지만 !!
react-router-dom의 <Link> 태그를 사용해서 간단하게 넘겨줄 수도 있다.
이 state를 받을 땐 useLocation()을 사용한다.

"react-router-dom 6버전을 기준"

state 보내기

<Link to={'/'} state={{name : "이혜미"}}></Link>

state 받아서 사용하기

import { useLocation} from "react-router-dom";
const { state } = useLocation();

console.log(state.name); // output : 이혜미