When trying to add routes in react,the webpage stays blank

Rodrigo Garcia 0
Viewed 19

I am a begginer in react and I was creating a webapp with multiple sites, so I downloaded react-router-dom with the npm command, however when I try using it, the webpages shows nothing.

Code:

import '../App.css';
import Header from "./header"
import Custom from "./custom"
import React, {useEffect, useState} from 'react'
import {BrowserRouter,Routes as Switch ,Route,Link} from 'react-router-dom';
let globalID =0

function App() {

  return <div>
    <div>
    <BrowserRouter>
      <p>Best to do list</p>
      <Switch>
      <Route path = "/hello-world">
        <h1>I am on route hello world</h1>
      </Route>
      </Switch>
    </BrowserRouter>
    <h2>I dont change with the page</h2>
    </div>
  </div>
}

export default App;

Website: Website failing

react-router-dom react-router reactjs javascript
1 Answers

Routes only accept a <Route> or <React.Fragment> as children

change :

<Route path = "/hello-world">
        <h1>I am on route hello world</h1>
      </Route>

to:

<Route path = "/hello-world" element={<h1> I am on route hello world</h1>}>
        
      </Route>
monim0
Related