CODEWITHSUNDEEP
javascriptreactjsreact-router-v4
panatoni
panatoni

Reputation: 809

React Router 4 links are working but components are not rendered

Dears, This is main component where I import other components and making Route object, Links are working history object are changing as well but components are not rendered (I don't use redux here). Console doesn't through any error as well

import React from 'react';
import {BrowserRouter as Router,Route,Link} from 'react-router-dom';
import Main from './components/Main';
import Dashboard from './components/Dashboard';
import Login from './components/Login';
import Register from './components/Register';

class App extends React.Component {
    render() {
        return (
            <Router>
                <div className='container'>
                    <ul>
                        <li>
                        <Link to="/">Main</Link>
                        </li>
                        <li>
                        <Link to="/register">Register</Link>
                        </li>
                        <li>
                        <Link to="/login">Login</Link>
                        </li>
                    </ul>

                    <Route  path="/" Component={Main}/>
                    <Route path="/login" Component={Login}/>
                    <Route path="/register" Component={Register}/>
                    <Route path="/dashboard" Component={Dashboard}/>


                </div> 
            </Router>

        ) 
    }

}

export default App;

Upvotes: 0

Views: 28

Answers (1)

Smarticles101
Smarticles101

Reputation: 1926

Try making Component lowercase, like this:

<Route path="/" component={Main}/>
<Route path="/login" component={Login}/>
<Route path="/register" component={Register}/>
<Route path="/dashboard" component={Dashboard}/>

Upvotes: 2

Related Questions