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

useRoutes exact path match in react

Girish Chaudhari answered on May 3, 2022 Popularity 3/10 Helpfulness 8/10

answer useRoutes exact path match in react

useRoutes exact path match in react

Comment

import {Outlet, useRoutes} from "react-router-dom"
    
    const App = () => {

      let routeElement = useRoutes([
        {
          path: "/",
          element: <GlobalPageTemplate />,
          children: [
            {
              path: "users",
              element: <Outlet />,
              children: [
                { path: "/", element:<h1>LIST USERS <h1/> },
                {
                  path: "/:id",
                  children: [
                    { path: "/", element: <h1>USER ID</h1> },
                    { path: "/settings", element: <h1>USER SETTINGS</h1> },
                  ],
                },
              ],
            },
            {
              path: "posts",
              element: <Outlet />,
              children: [
                { path: "/", element: <h1>LIST POSTS</h1> },
                {
                  path: "/:id",
                  children: [
                    { path: "/", element: <h1>POST ID</h1> },
                    { path: "/settings", element: <h1>POST SETTINGS</h1> },
                  ],
                },
              ],
            },
            {
              path: "teams",
              element: <Outlet />,
              children: [
                { path: "/", element: <h1>LIST TEAMS</h1> },
                {
                  path: "/:id",
                  children: [
                    { path: "/", element: <h1>TEAMS ID</h1> },
                    { path: "/settings", element: <h1>TEAM SETTINGS</h1> },
                  ],
                },
              ],
            },
          ]
        }
      ]);
    
      return routeElement
    }

Popularity 3/10 Helpfulness 8/10 Language javascript

Source: stackoverflow.com

Tags: javascript match path

Link to this answer
Share Copy Link

Contributed on May 03 2022

Girish Chaudhari

0 Answers Avg Quality 2/10

useRoutes exact path match in react

Contents

More Related Answers

useRoutes exact path match in react

Grepper

Documentation

Social

Legal

Contact

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