React,JS,TS

react-router-dom(HashRouter,Route,Link,withRouter) / sclice(문자열 자르기)

재준재준 2020. 7. 23. 16:48
react-router-dom

 

리액트 특성상 컴포먼트를 중첩해서 불러오기 때문에 exact={true}를 하므로 지정한 경로의 컴포먼트만 불러온다.

 

 

 

 

 

<Navigation /> 컴포넌트는 Link를 사용하였으므로 Router안에 존재해야한다.

 

 

 

 

<Link to="/">클릭하면 다른 주소로 이동시키는 컴포넌트

리액트 라우터를 사용할땐 <a href="/">사용시 페이지를 아예 새로불러오므로 리액트 상태들이 초기화되버린다.

그러므로 Link를 사용한다.

withRouter

withRouter 는 컴포넌트를 컴포넌트로 감싸는 역활을하며 감싼 컴포넌트의 상태를 props로 전달해준다.

.slice 문자열 자르기

 

(0~180) 까지 자르기