react-router-dom Questions

10

How to scroll to top on route change with react router dom v6? I have tried this, react-router scroll to top on every transition, which was my solution to make my page scroll to top on route change...
Babs asked 2/12, 2021 at 2:59

3

Solved

I have two navigation menu, Artists and Albums on menu bar. I am using react_rotuer_dom v6 Here is the nested navigation structure. Click Artists (Artist list will show) /artists Click Artist (Alb...
Franzen asked 17/2, 2022 at 18:54

7

Solved

I have this code: <Link to="/dashboard" style={{ color: '#A4A4A4' }}>Dashboard</Link> As part of my app, but if i'm currently viewing the /dashboard route, the page doesn't refresh. ...
Ulloa asked 21/11, 2018 at 21:26

17

I use react-router-dom version 6 and when I use this.props.history.push('/UserDashboard') it does not work. I changed it to const history = createBrowserHistory(); history.push('/UserDashboard') b...
Seyler asked 18/8, 2020 at 15:33

3

Solved

after browsing for a while on the internet I could not figure out why my nested routes do not work. index.js <BrowserRouter> 12 <Navbar /> 13 <App /> 14 </BrowserRouter> ...
Mccoy asked 13/9, 2022 at 10:10

21

Solved

I'm using React Router v6 and am creating private routes for my application. In file PrivateRoute.js, I've the code import React from 'react'; import {Route,Navigate} from "react-router-dom&qu...
Brunt asked 6/11, 2021 at 12:55

8

I'm struggling to find the right type for this situation. This is a simplified version of redirecting after login. The following produces a compiler error: Property 'from' does not exist on type '...
Cristionna asked 7/5, 2020 at 22:12

8

Solved

I have this error when I try to import useRouteMatch from react-router-dom module, I have this error : Attempted import error: 'useRouteMatch' is not exported from 'react-router-dom'. do I ha...
Rourke asked 15/10, 2019 at 17:29

4

Solved

Why react router v6 useParams returns object with properties possibly 'undefined'? In my code below, my IDE indicates const slug: string | undefined. const { slug } = useParams<"slug"&...
Bledsoe asked 16/11, 2021 at 15:59

3

On this repo: https://github.com/tlg-265/react-app-vanilla $ git clone https://github.com/tlg-265/react-app-vanilla $ cd react-app-vanilla $ yarn $ yarn start I have a dummy app with just 3 pages:...

2

Solved

So I´m currently refactoring a website, and so I do with the rrd, which was on v5 in the previous website version. Now, that the component doesn´t exist anymore we have to work with the new compone...
Bunt asked 9/4, 2022 at 12:26

6

Solved

I have a hypothetic React component named Component.ts with a code structure similar to that: import React from 'react'; import { useParams } from 'react-router-dom'; export const Guide = () =&gt...
Siegel asked 8/9, 2020 at 20:56

3

I am new to react router I followed the tutorial for the latest version 6.4.3 and am using the createBrowserRouter. For my App component below I attempted to add a children object to the index path...
Kuo asked 24/11, 2022 at 22:11

18

Is it possible to get the path pattern for the currently matched route? Example: <Route path=":state/:city*" element={ <Page /> } /> // Page.jsx function Page() { ... ...
Feces asked 18/2, 2021 at 18:3

7

Solved

I am trying to navigate to "/quiz" when Start Quiz button is clicked. However when I compile my code I am getting the following error on the website application: [Home] is not a <Route...

3

Solved

There are a few questions like this on SO, but they are old and outdated and solutions don't work anymore How can I change the title of the page so I don't have the same name in the History menu? I...
Gracye asked 15/4, 2022 at 17:43

4

I'm using the useRouteError() hook from react-router-dom in a React project to catch any errors that may occur during routing. However, I'm not sure what the correct type for the error object retur...
Misadvise asked 5/4, 2023 at 23:56

9

Solved

On early versions we can go back to previous route using history. history.goBack() How I can achieve that with v6 of react-router-dom?
Noggin asked 29/1, 2021 at 4:11

8

Solved

How to use useHistory() correctly? I can't make the transition from one react component to another. According to the instructions from the React documentation and also here on Stack Overflow, I can...
Apparition asked 14/11, 2020 at 21:3

1

I am trying to navigate to a page which may contain a percentage (%) sign in the url. e.g "www.domain.com/edit/name%" if (some condition is met then redirect) { let encodedString = encodeURICompo...

15

Solved

im using react router v6 and i every time i use initializing for authentication in my main file it shows this error. i cant find a solution in the internet for it. i want to render some routes only...
Aciniform asked 22/3, 2021 at 14:1

13

Solved

I am trying to upgrade to React Router v6 (react-router-dom 6.0.1). Here is my updated code: import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom'; <BrowserRouter> <R...
Mace asked 7/11, 2021 at 0:34

5

Solved

I am using react-router-dom for routing in my reactJs application. I have a Route, Account, that has nested routes in it. In the Account component I want to display different components based on th...
Floatable asked 28/3, 2019 at 3:40

5

I'm making a website where I'm using react-router-dom's NavLink components to prevent rerenders for a single page application experience. As I am trying to make the site responsive, I have been tr...
Peritonitis asked 5/6, 2019 at 16:21

5

How can I get the last part of the current url with react router v6? For example: If the current path is https://localhost:4200/example/example-details, then I want to check it like this const loca...
Orford asked 29/3, 2022 at 11:58

© 2022 - 2025 — McMap. All rights reserved.