웹 개발/React

React | Router - URL로 parameter 전송하기

곤이씨 2020. 8. 28. 01:11

Home.js

 

 

App.js

 

 

Profile.js

 

최초의 프로그램은 검색창(input)에 입력된 내용을 <Link to>를 이용해서 /Profile에 정보를 넘겼다.

그러나 이 방법은 오로지 클릭만으로 동작된다.

우리가 일반적으로 검색창에 내용을 입력한 뒤 엔터키를 누르면 자동으로 페이지가 넘어가는 방식은 불가능 한 것 같다.(꽤 많이 찾아봤지만 해결하지 못 했다... 물론 방법이 있을수도)

 

그래서 결국 URL에 parameter를 추가하여 직접적으로 정보를 받을 수 있게 했다. 보안이 필요한 정보라면 이 방법이 위험할 수 있지만 현재는 검색내용만을 받으면 되므로 괜찮을 것 같다.

 

 

URL 주소로 parameter를 전송하기 위해선 App.js의 path에 '/:' + 'parameter 이름'을 추가한다.

window.location.href로 원하는 주소로 redirect 시킨다.   - 끝 - 

 

 

- 참고 -

https://gongbu-ing.tistory.com/44