我正在尝试将参数传递给React Native Navigation标头标题。通过prop.navigation.setParams({title:'title'})设置参数也尝试过使用this.props。仍然无法正常工作。
最终,我想在页面上的redux状态调用中设置标题。
这是我的代码的片段。
const EditScreen = (props) => {
useEffect(() => {
props.navigation.setParams({title: 'title'})
})
return (
<KeyboardAvoidingView
enabled={true}
style={styles.avoidingView}
keyboardVerticalOffset={90}
behavior={'padding'}
>
<ScrollView style={styles.screen}>
<View>
//CODE OUTPUT HERE
</View>
</ScrollView>
</KeyboardAvoidingView>
);
};
EditScreen.navigationOptions = navData => {
return {
headerTitle: navData.navigation.getParam('title'),
headerLeft: (
<HeaderButtons HeaderButtonComponent={CustomHeaderButton}>
<Item
title={'Menu'}
iconName={Platform.OS === 'android' ? 'md-menu' : 'ios-menu'}
onPress={() => {
navData.navigation.toggleDrawer();
}}
/>
</HeaderButtons>
),
headerRight: (
<View style={styles.avatarContainer}>
<TouchableOpacity onPress={() => {
navData.navigation.navigate({
routeName: 'ProfileScreen',
params: {
userName: 'DummyUser',
}})
}}>
<CustomAvatarImage
source={require('../../../assets/avatar/avatar.jpg')}
/>
</TouchableOpacity>
</View>
),
}
};