Question 178958 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – Why is my React Router not displaying Home.js content?

My <Route> doesn’t work

The Route to home doesn’t display what’s in the Home.js file

import "./App.css";
import Navbar from "./components/Navbar";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import Home from "./pages/Home";

function App() {
  return (
    <div className="App">
      <Router>
        <Navbar />
        <Routes>
          <Route path="/" exact component={Home} />
        </Routes>
      </Router>
    </div>
  );
}

export default App;
Tags:

2

Answers


  1. 0 
    import "./App.css";
import Navbar from "./components/Navbar";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import Home from "./pages/Home";

function App() {
  return (
    <div className="App">
      <Router>
        <Navbar />
        <Routes>
          {/* Change here, but only for react-router V6 */}
          <Route exact path="/" element={<Home />} />
        </Routes>
      </Router>
    </div>
  );
}

export default App;
    Login or Signup to reply.
  2. 0 
    import "./App.css";
import Navbar from "./components/Navbar";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import Home from "./pages/Home";

function App() {
  return (
    <div className="App">
      <Router>
        <Navbar />
        <Switch>
          <Route path="/" exact component={Home} />
        </Switch>
      </Router>
    </div>
  );
}

export default App;

"and make sure you import Home from the valid folder"
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search