반응 네이티브의 샘플 앱에서 N 개보기를 사용하는 방법

Question

나는 네이티브에서 약간의 의문이 있습니다. 나는이 대답 (How to do a multi-page app in react-native?를) 읽을 수 있지만 나는 조금의 의심과 체재 :

• 나는 많은 뷰 Navigator를 사용하는 네이티브 앱 반작용,하지만 난 COMPONENTES N에 어떻게합니까? 예를 들어 5 가지 다른보기가있는 경우 이전 코드를 5 번 사용하고 ... n 번 사용합니까?

Answer 1

내 코멘트에 대해 자세히 알아 보려하십시오. 대신

if (routeId === 'SplashPage') { 
    return (
     <SplashPage 
      navigator={navigator}/> 
    ); 
} 
if (routeId === 'LoginPage') { 
    return (
     <LoginPage 
      navigator={navigator}/> 
    ); 
} 

의

은 동적 구성 요소를 얻을하는 데 사용하는 해시 테이블을 가지고있다.

const Component = VIEW_COMPONENTS[routeid]; 

그래서 당신의 코드는 조회 테이블에 단일 행 항목이 될 것이

const VIEW_COMPONENTS = { 
    'SplashPage': SplashPage, 
    'LoginPage': LoginPage 
}; 

renderScene = (route, navigator) => { 
    const ViewComponent = VIEW_COMPONENTS[route.id]; 
    return <ViewComponent navigator={navigator}/> 
} 

추가 화면처럼 보일 것입니다. 40 스크린을 가진 기본 앱이 있으며 이처럼 쉽게 관리 할 수 ​​있습니다.

이 항목을 추가하십시오. 당신은 이것에서 더 많은 것을 추상화 할 수 있습니다. 모든 뷰를 사용하는 위치 나 다음 뷰의 위치를 ​​신경 쓰지 마십시오. 대신 모든 것을 lookup 객체의 일부로 만드십시오. 모든보기가 표시 할 수있는 다음 경로를 지정하십시오. 모두 구성 가능한 모든 추가 정보를 전달할 수 있으며 화면을 여러 플로우에서 재사용 할 수 있습니다!