React Router not showing a page - React JS

Question

So I'm trying to make a web application with react router dom but the problem is React Router is not showing the page, When I click on the link it redirects but shows me nothing, When I go to http://localhost:3000/login/ manually it still does not show me anything, but it shows me the home page. Here is my code:

import { BrowserRouter as Router, Route, Link } from 'react-router-dom'

function HomeScreen() {
 return (
   <Link to='login/'>Login Screen</Link>
   // I'm only showing the related parts to keep this question small
)
}


function LoginScreen() {
    return (
        <h1>Login Screen</h1>
    )
}



function App() {
    return (
    <Router>
        <Route path='/' exact component={HomeScreen} />
        <Route path='login/' component={LoginScreen} />
    </Router>
    )
}



export default App

Try path='/login' (reactrouter.com/web/guides/quick-start) — user5734311
– user5734311, Commented Apr 6, 2021 at 6:50

Ali Taghipour · Accepted Answer · 2021-04-06 06:53:33Z

1

you have a mistake in navigation login route

  // here the problem --> login/  <Route path='login/' component={LoginScreen} />


function App() {
    return (
    <Router>
        <Route path='/' exact component={HomeScreen} />
        <Route path='/login' component={LoginScreen} />
    </Router>
    )
}

answered Apr 6, 2021 at 6:53

Ali Taghipour

1144 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user15530512 Over a year ago

Someone downvoted you but your answer works! Thanks so much!

Collectives™ on Stack Overflow

React Router not showing a page - React JS

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related