대응 경로는 하위 경로를 개별 모듈로 이동합니까?

Question

React Route를 사용하여 다음 작업을 수행 할 수 있습니까?

홈페이지

<Routes handler={App}> 
    <Profile path="profile" /> 
    <Explore path="explore" /> 
    </Routes> 

프로필

<Route> 
     <Route name="dashboard" handler={ProfileDashboard} /> 
     <Route name="repos" handler={ProfileRepos} /> 
    </Route> 

<Route> 
     <Route name="home" handler={ExploreHome} /> 
     <Route name="showcase" handler={ExploreShowcase} /> 
    </Route> 

Answer 1

당신은 라우터 반응과 그것을 달성 할 수있는 탐험! :)

그러나 나는 당신의 경로 구성 "일반 루트"방법을 그것을 확인하도록 건의 할 것입니다 : 당신이 routes 개체에 작업을 시작합니다이 사용

https://github.com/reactjs/react-router/blob/master/docs/guides/RouteConfiguration.md#configuration-with-plain-routes

을, 그리고 당신이 할 수있는 그냥 require 다른 경로와 조합을 기반으로 경로를 만듭니다. 뭐 그런 : 당신의 profile.js (당신이 explore.js에 동일한 작업을 수행 할 수 있습니다) 파일에서 다음

const routes = { 
    path: '/', 
    component: App, 
    childRoutes: [ 
     require('./profile'), 
     require('./explore') 
    ] 
} 

, 당신은 그런 일이됩니다

/* Import the ProfileDashboard and ProfileRepos here */ 

const profileRoutes = { 
    path: 'profile', 
    childRoutes: [{ 
     path: 'dashboard', 
     component: ProfileDashboard 
    }, { 
     path: 'repos', 
     component: ProfileRepos 
    }] 
}; 

을 그리고이 방법 당신은 당신이 원하는 것을 얻을 수 있습니다.

당신이 정말로 일반 경로를 사용할 수없는 경우, 당신은 같은 것을 할 수 있습니다 : 예를 들어

<Route path="/" component={App}> 
    { require('./profile') } 
    { require('./explore') } 
</Route> 

그리고 당신의 profile.js이 :

module.exports = (
    <Route path="profile"> 
     <Route path="dashboard" component={ProfileDashboard} /> 
     <Route path="dashboard" component={ProfileRepos} /> 
    </Route> 
); 

나도 몰라 라우터 반응 무엇을 버전을 사용할 수 있지만 모든 버전에서이 기능을 사용할 수는 있지만 제안 사항대로 최신 버전을 사용해보십시오. 그것은 멋진 것들을 많이 처리하기 때문에.

희망이 있습니다.