Basically, I would like to fetch the latest data every time user navigates to different tab. For example, I have summary page and details page for customers, which both includes the same customers container component. I'm doing my initial fetching in
As far as I understand both tabs happen to contain the same component and so React re-uses the DOM and doesn't create a new component instance, right?
You can use React's special
key prop to force React to replace a specific instance.
<div className="tab-content> <div key="tab-1" className="shared-component-across-tabs"> shared-component-across-tabs </div> </div>
And in the second tab you'd use
Otherwise your route handler component will receive
props.location.pathname from the router. You can also implement
componentWillReceiveProps and check if the pathname has changed and re-fetch the data in that case.