React-Router open Link in new tab content is opening in same existing tab

Viewed 266

I am using react-router for clicking button and opening different component in new tab button things are happening opposite means before clicking on that button that content is showing in the existing page without clicking that button and after clicking the button same content is showing as it is like first component for more insights check my code screenshot and output also

  1. index.js enter image description here

  2. Globe.js enter image description here

  3. Space.js enter image description here

  4. Main App.js enter image description here

  5. Output 1 before clicking the button enter image description here

  6. After clicking the button enter image description here

can anyone help me with this

2 Answers

The reason why you're still seeing the Globe component in a new tab is because App component will always be rendering as it is not dependent on any route.

You need to remove the <App /> line from index.js file and instead add a new route inside Switch as shown below:

<Route exact path="/" component={App} />

i deleted app.js file and reference related to that and then did following enter image description here

enter image description here

enter image description here

thank you brother saurabh for guiding me ❤

Related