일반적인 컴포넌트 렌더링으로 변수(props)를 넘길때

<DashboardView param1={parameter}/>

 이런식으로 넘긴다.

<컴포넌트이름 파라미터이름={값}> 과 같은 형태 !!

그런데 Router 를통해 라우팅할때는 

<Route path="/admin/DashboardView" exact component={DashboardView} />

이런 형태로 component를 호출한다.
그럼 변수는 어떻게 넘긴단 말인가?

<Route path="/admin/DashboardView" exact component={() => <DashboardView param1={parameter} />}/>

이런식으로 넘기면 넘길 수 있다.

그리고 해당 컴포넌트에서는 

// DahboardVeiw.js
export default function DashboardView(props) {
	console.log(props.param1);
	render(<div>리액트 배워보자</div>)
}

이와 같이 기존 props를 전달받듯이 받으면 된다.

 

+ Recent posts