[React] useLocation()을 이용해 URL 파라미터 가져오기

React는 router기능을 이용해 페이징처리를 할 수 있습니다.
useLocation()은 router에 있는 기능으로 페이지의 URL에 접근할 수 있습니다.

---

설치

npm install react-router-dom

페이징 기능을 사용하지 않더라도 useLocation()은 router에 있는 객체이기 때문에 router 설치가 필요합니다.

사용법

// JSX
import { useLocation } from 'react-router-dom';

function Wrap(props) {
    const [isLogined, setIsLogined] = useState(false);
    const location = useLocation();
   
    useEffect(() => {
      	const code = new URLSearchParams(location.search).get('code');
      	setIsLogined(code!==null);
    }, [location]);

  	~~~
}

• OAuth으로 로그인을 구현 시 로그인 성공시 파라미터로 code값을 제공합니다.
• 위 예시는 URL에 code 파라미터가 있는지 확인하여 로그인 여부를 판별합니다.