如果我创建了一个允许发送道具的导航堆栈,则各个屏幕组件内的navigationOptions
将不再起作用。我如何既可以在创建道具之前将其发送到屏幕,又可以控制每个屏幕内部的navigationOptions
?
例如:
const DefaultNavigator = propToPass => createStackNavigator(
{
First: { screen: props => <First {...props} propToPass={propToPass} /> },
...otherScreens,
},
navOptions
);
const AlternateNavigator = propToPass => createStackNavigator(
{
First: { screen: props => <AltFirst {...props} propToPass={propToPass} /> },
...otherScreens,
},
navOptions
);
class NavWrapper extends React.Component {
render() {
const { someProp, anotherProp} = this.props
if (something){
const ModifiedNavWithProp = AlternateNavigator(someProp);
return <ModifiedNavWithProp />
}else {
const ModifiedDefaultNavWithProp = DefaultNavigator(anotherProp);
return <ModifiedDefaultNavWithProp />
}
}
}
export default NavWrapper
class First extends React.Component {
static navigationOptions = ({ navigation }) => {
console.log("navigation doesn't log here!", navigation)
return {...navigationOptions};
}
render(){/****/}
}
我可以通过将navigationOptions
更改为以下内容来修复First
屏幕内的DefaultNavigator
,但是我不确定如何传递道具。
const DefaultNavigator = propToPass => createStackNavigator(
{
First: { screen: First },
...otherScreens,
},
navOptions
);
我目前正在使用反应导航v2.17.0