导航屏幕组件中的选项不起作用

Question

如果我在StackNavigator内的屏幕组件中设置导航选项以更改抽屉导航器中堆栈的标题，则不会考虑导航选项。但是，我可以传递默认导航选项，这些选项被考虑在内。如果我不传递默认导航选项，它不会改变行为。这是反应导航 v 4.x

在这里，我为我的抽屉创建了堆栈导航器屏幕

drawerNavigator = () => {
let drawerRoutes = {}
this.state.routes.forEach(r => {
let stackRoute = {}
let t = () => <First name={r} />
stackRoute[r] =  { screen : t }
let stackOptions = {
initialRouteName: r,
defaultNavigationOptions: stackNavigationOptions
}
let s = createStackNavigator(stackRoute, stackOptions)
drawerRoutes[r] = { screen : s }
})
let drawerOptions = {
drawerWidth: '75%',
initialRouteName: this.state.routes[0],
contentComponent: props => <Menu {...props} />,
contentOptions: drawerItemsOptions
}
return createDrawerNavigator(drawerRoutes, drawerOptions);
}

然后在我的组件中，我尝试设置堆栈的导航选项，但没有考虑在内......

export default class First extends Component {
static navigationOptions = ({ navigation }) => {
return {
headerTitle: 'hahahaha',
headerRight: () => (
<Button
onPress={() => alert('This is a button!')}
title="Info"
color="#fff"
/>
),
}
}
render() {
return (
<SafeAreaView style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<StatusBar transluscent backgroundColor="transparent" barStyle="dark-content" />
<Text>{this.props.name}</Text>
</SafeAreaView>
);
}
}

Answer 1

好的，我发现如果我以这种方式通过屏幕

stackRoute[r] =  { screen : First }

而不是

let t = () => <First name={r} />
stackRoute[r] =  { screen : t }

导航选项被考虑在内。但是我不能以这种方式传递道具....