TabStackNavigator의 상태?

Question

TabNavigator에는 자체 상태가없는 것 같습니다. state 또는 props을 사용할 수 있습니까?

통지 TabIcon에 the number of unread notification을 표시하고 싶습니다.

export default TabNavigator(
    { 
    ... 
    Noti: { 
     screen: NotificationStackNavigator, 
    }, 
    ... 
    }, 
    { 
    navigationOptions: ({ navigation }) => ({ 
     header: null, 
     tabBarIcon: ({ focused }) => { 
     const { routeName } = navigation.state; 
     let iconName; 
     switch (routeName) { 
      ... 
      case 'Noti': 
      iconName = 'ios-notifications'; 
      break; 
      ... 
     } 
     ... 
     if(iconName == 'ios-notifications') { 
      return (
      <IconBadge 
       MainElement={ 
       <Ionicons 
        name={iconName} 
        size={30} 
        style={{ marginBottom: -3 }} 
        color={focused ? Colors.tabIconSelected : Colors.tabIconDefault}/> 
       } 
       BadgeElement={ 
       <Text style={{color:'#FFFFFF'}}> 
        {{this.state.notifications}} // my goal 
       </Text> 
       } 
       IconBadgeStyle={{ 
       backgroundColor: '#f64e59', 
       position: 'absolute', 
       right:-10, 
       top:0, 
       }} 
      /> 
     ); 
     } 
     ... 

불명확 한 점이 있으면 알려주십시오. 미리 감사드립니다.

업데이트 내 TabNavigator를 리팩토링 할 계획입니다. 이게 당신이하는 말인가요?

export default TabNavigator( 

to 

const MainTabNavigator = TabNavigator(

class MainTabNavigator extends Component { 
    state = {notification} 

export default connect(...)(MainTabNavigator); 

업데이트 2 MainTabNavigator의 상위 레벨 구성 요소는 다른가 TabNavigator입니다. 다른 해결책이 있습니까?

const RootTabNavigator = TabNavigator ({ 
    Auth: { 
     screen: AuthStackNavigator, 
    }, 
    Welcome: { 
     screen: WelcomeScreen, 
    }, 
    Main: { 
     screen: MainTabNavigator, 
    }, 

Answer 1

당신은 전체 문서는 답변을 here