Inside React Native <Navigator/>，我该如何引用传入的当前route.name？

在< Navigator />中，根据传入的当前route.name，我想执行以下操作，但出现错误：'route is not defined'。为什么？我该怎么做呢？Inside React Native <Navigator/>，我该如何引用传入的当前route.name？

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

预先感谢您！

来源

2016-07-23 Jo Ko

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

来源

2016-07-23 21:45:49 zackify

我试图风格的导航栏本身，如改变其颜色，而不是它的组件。用我的方法会有办法解决吗？就像在特定的路线上一样，导航栏是蓝色的，而在另一个导航栏上则是红色的。 –

检查以确定您是否收到了我的最新评论。请告诉我。 –

看起来像唯一的方法是包装导航栏，并使用REDX或其他方式获取当前路线：https：//github.com/facebook/react-native/issues/2560#issuecomment-139919812。这个问题谈论使用基于通量的解决方案https://github.com/facebook/react-native/issues/3926#issuecomment-154688017。 – zackify

您可以像这样获取当前路由：navigator.getCurrentRoutes（）其中navigator是导航器对象。在你的榜样，你可能将不得不使用this.getCurrentRoutes或引用它像下面的链接提示：

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

来源

2016-07-24 06:25:54 no8do

这是一个要点。你知道我做错了什么吗？即使传入主页组件，navBar样式仍不会更新。 –

https://gist.github.com/jaewonch/8d56d9f598fe68103b4454f31d6ba7f8 –

Inside React Native <Navigator/>，我该如何引用传入的当前route.name？

回答

相关问题