React 화면 이동 및 데이터 전달하기

React의 @reach/router 모듈을 활용하여 화면 이동 및 데이터 전달을 해본다.

Link 활용

import { Link } from '@reach/router';

 <Link to="/test" state= { { info: 'hello' } }>MOVE</Link>

navigatge 활용

import { navigate } from '@reach/router';

<Button onClick={()=> {
  navigate('/test', {state: { info: 'hello' }})
}}>MOVE</Button>

데이터 받기

const ViewDocument = ({location}) => {
  const data = location.state.info;
}