使用反应本机路由器通量的自定义导航栏

Question

我似乎找不到任何完整的示例来创建自己的 navBar 组件，然后将其连接到 react-native-router-flux .谁能帮我？看看 github 问题，这似乎是库的一大需求。我想做的是：

• 创建一个带有左按钮和右侧图像的新组件。
• 根据场景更改按钮图标，但使用右侧的相同图像。
• 将其连接到 react-native-router-flux，以便导航栏正确显示并以与默认导航栏相同的方式跟踪用户位置。

谢谢！

Answer 1

这是我

面临的类似问题。没有在线教程告诉您如何使用自定义导航栏。我找到了一种适合我的方法。试试这个：

<Router navBar = {MainNavBar}>
    <Scene key = "home" component = {HomeScreenContainer} title = "Home" initial = {true} />
</Router>

这是定义场景的主根组件的代码。您必须在路由器中或需要导航栏的任何场景中传递导航栏组件。

您的导航栏将是这样的：

<NavigationBar      
    leftComponent = {<TouchableOpacity><Icon name="sidebar" /></TouchableOpacity>}
    centerComponent = {<Title>{props.title}</Title>}
    />

希望这对:)有所帮助