testPage에서 검사를 진행한 후 결과 유형을 result page에 넘겨줬다.
일회성에다 넘기는 데이터도 하나였기때문에 redux를 사용하는 건 오히려 부담이었다.
그래서 useNavigate()로 경로를 바꿔줄 때, 데이터를 함께 전달했다!
순서는 간단하다!
useNavigate()로 경로를 바꾸며 값을 전달해주면,
useLocation()를 이용해 받으면 된다!
일단 그냥 useLocation()를 사용해보았다.
반환받은 값을 console에 찍어보니
{pathname: '/test/result', search: '', hash: '', state: null, key: 'w6ozm642'}
가 찍혔다.
state으로 값을 전달해주기위해
testPage
let navigator = useNavigate();
navigator('/test/result', {state: {type: result}});
위 코드처럼 result를 전달했고
result page
const type = useLocation().state.type;
이렇게 잘 받았다!
야호
useLocation
과useNavigator
를 사용하여 컴포넌트에서 사용하려는 값을URL parameter
로 받을 수 있도록 구현하신 건가요?