Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- Regex
- Windows
- startfile
- OpenSCAD
- 가상머신호스트
- cifsutils
- FTP
- 보안연결실패
- Basic Auth
- 윈도우
- React #React-Table
- Notepadplus
- SFTP
- 임펠러
- PDFCreator
- Notepad
- react #router
- linux ssh root debian
- PyLucene
- Printer Driver
- springboot #spring #jackson
- 노트패드뿔뿔
- 소스 <script> 로딩 실패
- debian
- 정규표현식
- mailutils
- firefox 파이어폭스
- Notepad++
- VM 호스트 주소
Archives
- Today
- Total
JJC's 테크니컬 다이어리
[React] Router 컴포넌트에서 location.state 사용하여 자식컴포넌트로 state 전달 본문
React Router 컴포넌트에서 자식컴포넌트로 state 전달
location.state를 활용하는 방식임.
네비게이션 메뉴를 표시하는 부분의 Link 또는 NavLink의 to 속성을 다음과 같이 지정하면 하위 컴포넌트에서 받아쓸 수 있음.
[상위 Router 컴포넌트의 Link 태그]
username:this.state.username}}}>하위 컴포넌트
[하위 컴포넌트 클래스의 componentDidMount 이벤트핸들러]
하위 컴포넌트에서는 다음 예제처럼 전달받은 데이터에 접근 가능
componentDidMount: function() {
var recievedMessage = this.props.location.state.username
},