React route 질문드립니다 . !

Question

react 에서 react-router-dom 설치후 라우팅 을 배우고있습니다. . 현재 궁금한점은 페이지로 이동시킬대 data를 함께전송하는것인데, Matcj.params 로 데이터를 주고 받을때 어떻게사용하는지 궁금합니다.match.params 는 react-router-dom 모듈설치 없이 react 내장 함수같은건지, 따로 설치를 해야 사용이가능한지도 궁금합니다 . 코드가 궁금한것이 2가지가있는데, 질문 1 )현재 app.js 부모 컴포넌트에서 state를 관리하고있는데 부모컴포넌트에서 let name ='kim' 이라는 변수에값을 넣고서 자식 컴포넌트 (Test)에서 받으려할때입니다 (export/import 다한후)부모컴포넌트에서 라우트를사용하여 보내고test 자식 컴포넌트 에서는 function Test(match){

match.params.name

} 하면 받아지는건가요? 질문2) } />이코드에서 name 은 props 사용법으로 파라미터로 받아서 props.name 하면 되는건 알겠는데, render 사용할때 (props) 와 스프레드 ...props 는 무엇을 뜻하는건가요 복사카피하는건알겠는데,왜 저자리에 무엇을위해 있는건지 . . 저 props 를 자식컴포넌트에서 받을때는 어떻게 받아쓰는건가요 . . ㅠㅠ

파스티노 · Accepted Answer

설명을 자세히 드리고 싶은데 아직 구조에 대한 이해가 많이 없으신듯하여 ㅠㅠRouter 개념이랑 props의 개념을 문서로 쭉 읽어보시는게 좋을 것 같습니다. Route는 url뒤에 붙는 /article과 같은 path에 접속했을 때 어떤 컴포넌트를 띄워줄지 정의하는 거에요.따라서 Route 정의하신 부분은 부모 컴포넌트라고 하긴 점 애매한 것 같구요. 말구 으로 적으셨다면해당 컴포넌트는 부모 컴포넌트가 되고, Test는 자식 컴포넌트가 되는거죠. 이렇게 되면 아래와 같이 props를 받아서 사용할 수 있어요.function Test({name}){

{name}

} 결론은 Route에 props를 줄려면 질문 1번과 같이 해서는 불가능하고 2번처럼 하면 될 것 같아요.Route는 리액트에서 제공해주는 내장 라이브러리인데 여기에서 기본적으로 제공해주는 props가 있는거죠. 그 props를 spread 라는 es6문법을 써서 Test 컴포넌트에 값을 전달한 것입니다. (spread 문법은 따로 검색해보세요)잘 이해 안되시면 여기한번 확인해보세요https://stackoverflow.com/questions/52070532/render-props-react-route?rq=1 도움이 됐을지 모르겠네요.

bumoo king · Answer

감사합니다 선배님 도움이 많이 되었습니다!

React route 질문드립니다 . !

2개의 답변

#props 목록