How to maintain state between routes with React Router?
Personally, I chose to ditch react-router in this case and create a parent component with a state containing the current tab to display, while only displaying the active one.
Here's a very simple example
<div style={{display: this.state.currentTab === 'component_a' ? 'block' : 'none'}} > <ComponentA /> </div> <div style={{display: this.state.currentTab === 'component_b' ? 'block' : 'none'}} > <ComponentB /> </div>
You have two options, use Redux, or show/hide components based on tabs.
Heres an example to show/hide components
{this.state.showAboutMe ? <AboutMeComponent navigation={this.props.navigation} props={this.props.user} /> : undefined}