Hi,
I have a basic stack navigator:
const screens = { Home: { screen: Home, navigationOptions: { title: "Home" } }, Profile: { screen: Profile, navigationOptions: { title: "Profile" } } }; export default createAppContainer(createStackNavigator(screens));
How to change the title "Profile"
on the screen "Profile"
depending on props? In React.js, I'd simply create a Link
in the parent component with a dynamic path such as <Link to=profile/${username}>
`, and then retrieve it thanks to props.match.params
.
In React Native, the only way to pass props between pages seems to be through navigation.navigate("Profile", props)
. So if the profile belongs to a user named "Joe", how can I dynamically update navigationOptions.title
in my stack navigator?
I've read the official react-navigation' doc, but they only explain how to do it with class components. Static
can't work with a functional component such as mine:
export default function Profile({ navigation }) { const { name, details } = navigation.state.params; return ( // do stuff ); }
Thanks!
submitted by /u/MonsieurLeland
[link] [comments]