Questions tagged [react-router-dom]

Use this tag for questions regarding DOM use and bindings of React Router v4, v5, and v6.

Introduction

React Router DOM is a package that contains all the DOM bindings for React Router. That includes things such as HashRouter and BrowserRouter which are specific to DOM use for the browser.


Docs

Related tags

7372 questions
332
votes
7 answers

React : difference between and

Can someone explain the difference between and I don't know the meaning of exact.
batt
  • 3,382
  • 2
  • 11
  • 12
240
votes
14 answers

React: 'Redirect' is not exported from 'react-router-dom'

I am getting the following error when running npm run start in the terminal. Attempted import error: 'Redirect' is not exported from 'react-router-dom'. I have reinstalled node_modules, react-router-dom, react-router. Also restarted the terminal…
Zero Cool
  • 2,541
  • 2
  • 8
  • 13
194
votes
18 answers

Error: [PrivateRoute] is not a component. All component children of must be a or

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"; import {isauth} from 'auth' function PrivateRoute({…
Rajanboy
  • 2,266
  • 2
  • 8
  • 15
187
votes
10 answers

Detect Route Change with react-router

I have to implement some business logic depending on browsing history. What I want to do is something like this: reactRouter.onUrlChange(url => { this.history.push(url); }); Is there any way to receive a callback from react-router when the URL…
184
votes
11 answers

How can I redirect in React Router v6?

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'; } />
Hongbo Miao
  • 45,290
  • 60
  • 174
  • 267
154
votes
16 answers

using history with react-router-dom v6

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') but I still have a problem that when i would like to…
zineb
  • 1,549
  • 2
  • 7
  • 6
134
votes
8 answers

How to go back to previous route in react-router-dom v6

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?
Hamza Khursheed
  • 2,399
  • 2
  • 15
  • 17
121
votes
6 answers

Property 'exact' does not exist on type

I am trying to use react-router-dom inside my react app and also I am using typescript instead of javascript. The issue here is that I can't import Route inside my component and make it work. I already installed @types/react-router-dom but for some…
Veselin Kontić
  • 1,638
  • 2
  • 11
  • 23
114
votes
18 answers

Error "Error: A is only ever to be used as the child of element"

I am trying to use routing for the first time and followed the exact instructions from Udemy: File App.js: import { Route } from "react-router-dom"; import Welcome from "./Pages/Welcome"; import Game from "./Pages/Game"; import Leaderboard from…
Segev
  • 1,187
  • 2
  • 7
  • 6
114
votes
12 answers

Failed to compile. Module not found: Can't resolve 'react-router-dom'

After npm start, the browser gives the error: Failed to compile ./src/components/App/App.js Module not found: Can't resolve 'react-router-dom'. React-router-dom has been added to the dependencies in npm and so has react-router and react. Project…
Dokme
  • 1,195
  • 3
  • 8
  • 10
106
votes
12 answers

How to get query parameters in react-router v4

I'm using react-router-dom 4.0.0-beta.6 in my project. I have a code like following: And I want to get query params in HomePage component. I've found location.search param, which looks like this:…
andrfas
  • 1,320
  • 2
  • 10
  • 16
100
votes
10 answers

React Router V6 - Error: useRoutes() may be used only in the context of a component

I have installed react-router-domV6-beta. By following the example from a website I am able to use the new option useRoutes I have setup page routes and returning them in the App.js file. After saving I am getting the following error: Error:…
Galanthus
  • 1,958
  • 3
  • 14
  • 35
98
votes
1 answer

React-Router - Link vs Redirect vs History

There seems to be some confusion with what to use over the other: history.push('/some/path') I have been using React/Router for a little while now, and different posts/answers say different things…
Phil
  • 3,342
  • 5
  • 28
  • 50
93
votes
8 answers

Jest, Enzyme: Invariant Violation: You should not use or withRouter() outside a

I have a which outputs one component and list of contacts presentated by . The problem is that in the test for when I try to mount it, test outputs an error Invariant Violation:…
Maria Piaredryj
  • 1,584
  • 3
  • 16
  • 35
91
votes
12 answers

Error: useHref() may be used only in the context of a component. It works when I directly put the url as localhost:3000/experiences

I have a navbar that is rendered in every route while the route changes on click. ./components/navbar.jsx import React, { Component } from 'react'; import '../App.css'; import { Link } from 'react-router-dom'; class Navbar extends Component { …
tendinitis
  • 936
  • 1
  • 5
  • 9
1
2 3
99 100