React Navigation: How to share data between main screen and modals

Viewed 53

Working on react native with react navigation, building an app. There is a topic screen with a complex data object, and using React Navigation's Modal to show some parts of data, separately. The problem is when the user navigates to a modal screen, I have to pass the topic id as param and fetch topic data from the server once again, and because of the nature of data, users may open and close modals several times at a time. Couldn't find a solution to share data from the parent screen to its modals, and I don't want to share data with State and Context. So is there another way to pass data to modal screen without using param or hooks?

1 Answers

Have you tried navigating to the modal like that :

navigation.navigate("YourModalName", {
            topic: yourTopicObject,
            },
});

You should be able to use the topic object in your modal like that :

class YourModalName extends Component {

    componentDidMount() {
        console.log(this.props.topic); // Accessing object in props.topic
    }

}
Related