我试图在React Navigation屏幕的标题栏的headerRight
中显示一个按钮,但是我似乎无法使其正常工作。
我希望在headerRight
时显示开始按钮(props.players.length > 1
中的内容)。
有人能指出我正确的方向吗?
答案 0 :(得分:1)
您可以使用此处描述的标题相同的机制:https://reactnavigation.org/docs/en/headers.html#setting-the-header-title
设置导航参数并将其用于您的navigationOptions。
您的情况:
state = { players: 0 };
static navigationOptions = ({ navigation }) => {
return {
headerRight: navigation.getParam('players', 0) > 1 ? <YourHeaderButtonComponent /> : null ,
};
};
addPlayer = () => {
this.setState(({players}) => {
this.props.navigation.setParams({players: players + 1})
return {players: players + 1 }
});
}
render {
...
<Button onPress={this.addPlayer}
...
}
答案 1 :(得分:0)
如果您有一个嵌套导航,例如父 stackNavigator 中的子 bottomTabNavigator,请查看根据子导航器的状态应用父屏幕选项,请参阅文档 here
对我来说,Using navigation.setOptions 的第二个选项与子底部选项卡导航器一起使用,因此我可以根据 bottomTabNavigator 页面更改 stackNavigator 标题选项。