2017-12-04 13 views
0

React-Native를 처음 사용하고 2 탭 탐색기를 사용하려는 앱을 만들려고합니다. 외부 탭 및 내부 탭.탭 탐색기에서 탭 탐색기를 사용하는 방법은 무엇입니까?

탱크, 경고 및 설정을위한 외부 탭 ...지도보기와 목록보기 탱크 내부 내부 탭 ...

export default class Home extends Component { 
static navigationOptions = { 
    header:null 
}; 

constructor(props) { 
    super(props); 
    this.state = { 
    } 
} 

render() { 
    return (
     <MyApp/> 
    ); 
} 
} 
export const MyApp = TabNavigator({ 

tanks: { 
screen: TanksScreen 
}, 
alerts: { 
screen: AlertScreen 
}, 
Settings: { 
    screen: SettingScreen 
}, 
}, 

그리고를 사용하여 TanksScreen

export default class TanksScreen extends Component { 
static navigationOptions = { 
header:null 
}; 

constructor(props) { 
    super(props); 
    this.state = { 
    } 
} 
render() { 
    return (
     <MapsView/> 
); 
} 
} 
export const MapsView = TabNavigator({ 

Map: { 
screen: MapsScreen, 
}, 
List: { 
screen: ListScreen, 
}, 
}, 

이 다음 코드 위의 코드에서 외부 탭 탐색기의 모든 기능을 사용할 수 있지만 내부 탭의 경우 탭은 목록보기 화면으로 이동하거나지도 뷰의 텍스트 또는 UI 구성 요소를 렌더링하지 않습니다.

뭐가 잘못 되었나요? 또는이 요구 사항을 수행 할 수있는 방법이 있습니다. 미리 감사드립니다.

답변

1

TanksScreen 구성 요소는 내부 탭만 반환하므로 외부 탭에 직접 연결하면 문제를 해결할 수 있습니다.

export const MyApp = TabNavigator({ 
    tanks: { 
    screen: MapsView 
    }, 
    alerts: { 
    screen: AlertScreen 
    }, 
    Settings: { 
    screen: SettingScreen 
    }, 
} 
+0

lazyLoad를 사용하면 문제가 발생합니다. 어쨌든 당신의 대답은 또한 mapsView를 사용하는 간단한 방법을 제공합니다. @nimarod 감사합니다. – HungrySoul