Breaking News: Grepper is joining You.com. Read the official announcement!

How to use React Router

Add Answer

Md. Ali Azgor AY answered on September 18, 2021 Popularity 9/10 Helpfulness 2/10

answer How to use React Router

related what is router in react

related router in react

How to use React Router

Comment

How to use React Router

import React from "react";
import ReactDOM from "react-dom/client";
import {
  createBrowserRouter,
  RouterProvider,
} from "react-router-dom";
import "./index.css";

const router = createBrowserRouter([
  {
    path: "/",
    element: <div>Hello world!</div>,
  },
]);

ReactDOM.createRoot(document.getElementById("root")).render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>
);

Popularity 9/10 Helpfulness 2/10 Language javascript

Source: reactrouter.com

Tags: javascript react-router

Link to this answer
Share Copy Link

Contributed on Apr 16 2023

Md. Ali Azgor AY

0 Answers Avg Quality 2/10

Closely Related Answers

what is router in react

Comments(1)

React router as a browserRouter in App.js for navbar links like Home,
services,conatct-us etc.
   // npm install react-router-dom

// ##### Basic Routing #####
import React from 'react';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';

export default function App() {
   return (
      <Router>
         <div>
            <nav>
               <ul>
                  <li>
                     <Link to="/">Home</Link>
                  </li>
                  <li>
                     <Link to="/about">About</Link>
                  </li>
                  <li>
                     <Link to="/users">Users</Link>
                  </li>
               </ul>
            </nav>

            {/* A <Switch> looks through its children <Route>s and
            renders the first one that matches the current URL. */}
            <Switch>
               <Route path="/about">
                  <About />
               </Route>
               <Route path="/users">
                  <Users />
               </Route>
               <Route path="/">
                  <Home />
               </Route>
            </Switch>
         </div>
      </Router>
   );
}

function Home() {
   return <h2>Home</h2>;
}

function About() {
   return <h2>About</h2>;
}

function Users() {
   return <h2>Users</h2>;
}

Popularity 10/10 Helpfulness 4/10 Language javascript

Source: Grepper

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Sep 18 2021

Blue-eyed Bee

0 Answers Avg Quality 2/10

router in react

Comment

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

Popularity 10/10 Helpfulness 2/10 Language javascript

Source: www.geeksforgeeks.org

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Jun 03 2022

Govind Mishra

0 Answers Avg Quality 2/10

How to use React Router

Contents

More Related Answers

How to use React Router

Closely Related Answers

what is router in react

router in react

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.