Inside React Native <Navigator/>, как мне передать текущее имя route.name?

Question

В < Навигатор />, основываясь на текущем имени route.name, я хочу сделать следующее, но я получаю сообщение об ошибке: «route not defined». Почему это так? И как мне это сделать?

<Navigator 
... 
navigationBar={<Navigator.NavigationBar style={route.name == 'Home' ? styles.homeNavBar : styles.normalNavBar} .../> 
/> 

Заранее благодарю вас!

Answer 1

route не определен, потому что эта переменная не указана для вас нигде в этом коде. Если вы хотите изменить стиль, но по-прежнему использовать Панель навигации, вы лучше писать так: https://stackoverflow.com/a/33697459/1487687

Ваш объект NavigationBarRouteMapper будет маршрут впрыскивается в каждой функции:

var NavigationBarRouteMapper = { 
    LeftButton: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.leftButton }</Text> 
    ) 
    }, 
    Title: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.title }</Text> 
    ) 
    }, 
    RightButton: function(route, navigator, index, navState){ 
    return(
     <Text>{ route.rightButton }</Text> 
    ) 
    } 
} 

Если вы вам нужно настроить панель непосредственно, вам лучше создать свой собственный компонент навигационной панели. Я бы взглянул на источник, чтобы получить эту идею: https://github.com/react-native-community/react-native-navbar

Answer 2

Вы можете получить текущий маршрут следующим образом: navigator.getCurrentRoutes(), где навигатор - объект Navigator. В вашем примере, вы, вероятно, придется использовать this.getCurrentRoutes или ссылаться на него как на следующую ссылку предлагает:

https://facebook.github.io/react/docs/more-about-refs.html