수입품을 가진 React Router에 React 구성 요소의 다른 인스턴스 만들기

Question

동일한 구성 요소를 사용하려고하지만 루트에 따라 다른 구성 요소를 전달하려고합니다. 이와 같이 :

모든 경로는 구성 요소의 동일한 인스턴스를 받고 첫 번째 getData 소품 만 사용하는 것이 문제입니다. ApplicantsContainer 구성 요소의 다른 인스턴스를 선언하는 방법은 무엇입니까?

Answer 1

당신은 항상 <Router/>

예를 들어, 외부의 새 구성 요소를 만들 수 있습니다 버전

<Route path="new" component={ApplicantsContainer} 
    getData={ApplicantStore.getNew.bind(ApplicantStore)}/> 
<Route path="prescreen" component={ApplicantsContainer} 
    getData={ApplicantStore.getPrescreen.bind(ApplicantStore)}/> 

는

// Assume getData is a prop you need to set in ApplicantsContainer 
const ApplicantsContainerForNew = (
    <ApplicantsContainer 
    getData={ApplicantStore.getNew.bind(ApplicantStore)} 
    /> 
) 

const ApplicantsContainerForPrescreen = (
    <ApplicantsContainer 
    getData={ApplicantStore.getPrescreen.bind(ApplicantStore)} 
    /> 
) 
... 

<Route path="new" component={ApplicantsContainerForNew}/> 
<Route path="prescreen" component={ApplicantsContainerForPrescreen} />