❓ 쿼리스트링(Query String) 이란

• URL의 뒤에 입력 데이터를 함께 제공하는 가장 단순한 데이터 전달 방법이다. 웹개발에서 데이터를 요청하는 방식 중 주로 GET방식으로 데이터를 요청할 때 쓰이는 방법.
• URL주소뒤에 물음표(?)를 붙이고 key1=value1&key2=value2...방식으로 데이터를 요청한다.

나는 선택화면에서 번호를 선택하면 그 번호에 따라 메인 페이지의 url을
www.url.com?id=3
이런식으로 설정해서 id 번호를 받아왔다. 또한 api요청을 보낼때에도 query string에서 가져와서 요청하면 되므로 편하게 사용했다.

사용법

프로젝트에서 router를 사용했기 때문에 useNavigate를 이용해서 페이지를 렌더링 시켰다.

내가 처음 실수 한건

navigate(`/?id=${id}`)

이렇게 바로 넘겨버린 거였는데

navigate({
 pathname:'/',
 search: `?id=${id}`
})

❗️ 이런 식의 방법이 국룰이라고 한다.

Query String 가져오는법

const { search } = useLocation();
const query = search.split(/[=,&]/);

📌 이렇게 하면 url을 =과 &로 잘라서 id=3에서 3만 가져올수 있다.