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
27
votes
3 answers

React Router with custom history not working

When I was using BrowserRouter from react-router-dom, My Routes were working. But to use custom history, I replaced BrowserRouter with Router from react-router. After that my Route components are not loading properly but the url is changing…
27
votes
4 answers

How to send params in useHistory of React Router Dom?

I am using React Router hooks for navigation useHistory. Navigate : history.push("/home", { update: true }); In home : I am trying to get params let {update} = useParams(); But update is always undefined. Whats wrong with this code. Any…
Kais
  • 1,925
  • 3
  • 23
  • 35
27
votes
2 answers

Usage of exact and strict props

I am working with React-Router in React-JS: The is an built in component and have two different props: exact and strict Problem The documentation does not clearly defines the differences in between the exact and strict . Kindly help me. The…
Ishmal Ijaz
  • 5,317
  • 3
  • 11
  • 17
26
votes
3 answers

No routes matched location "/login" react router dom v6

I am trying to organize the routes in `react-router-dom v6. And here is my flow: root AppComponent function AppComponent() { return ; } AppRoute.js (base routes) const AppRoute = () => { return ( <>
Saroj Shrestha
  • 2,696
  • 4
  • 21
  • 45
24
votes
3 answers

NavLink exact prop not working for react-router-dom 6

I am currently using "react-router": "^6.0.0-beta.0", "react-router-dom": "^6.0.0-beta.0", The problem with NavLink of react-router-dom that i am facing now is that the root path "/" is always active, other paths are of no problem and they…
aitsamahad
  • 425
  • 1
  • 3
  • 10
24
votes
1 answer

Reactjs - `component` vs `render` in Route

I have two doubts regarding usage of Route from react-router-dom(v4.3.1): When do we use component vs render in Route:
Sreekar Mouli
  • 1,313
  • 5
  • 25
  • 49
24
votes
1 answer

React-router-dom and Redirect not being added to history?

Outline: I'm currently trying to learn react/redux/router. As a practice project, I'm working on a basic contact/client management app. While using react-router-doms Redirect component. I can't get the back/forward navigation to work as…
denden
  • 1,309
  • 1
  • 14
  • 23
23
votes
7 answers

Attempted import error: 'useRouteMatch' is not exported from 'react-router-dom'

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 have a wrong version of the react-router-dom module ?…
Janus
  • 645
  • 2
  • 7
  • 18
23
votes
5 answers

How to add react-router per each Material-UI TableRow?

How to add link per TableRow in .map? *my error is validateDOMNesting(...): cannot appear as a child of "< a >" im using react router react-router-dom how to add link in every loop of .map in Table TableRow? import React, { Fragment } from…
22
votes
7 answers

React router v6 how to use `navigate` redirection in axios interceptor

import axios from "axios"; import { useNavigate } from "react-router-dom"; export const api = axios.create({ baseURL: "http://127.0.0.1:8000/", headers: { "content-type": "application/json", }, }); api.interceptors.response.use( …
januw a
  • 2,056
  • 5
  • 18
  • 39
22
votes
6 answers

How to get params in component in react router dom v4?

I have this code: the filter param or '' on the root is suppose to be on App components' props base on the previous react router versions? This is my code on my…
gpbaculio
  • 5,693
  • 13
  • 60
  • 102
21
votes
5 answers

What is the alternative for Redirect in react-router-dom v 6.0.0?

New version of react-router-dom (v6.0.0) doesn't identify "Redirect". What is the alternative for it?
Ali Nematollahi
  • 221
  • 1
  • 2
  • 5
21
votes
5 answers

How to define fallback route properly in react-router-dom

I have the following Router definition: I want any unmapped route (i.e /foo) to redirect back to…
Mugen
  • 8,301
  • 10
  • 62
  • 140
20
votes
7 answers

React Router not working with Github Pages

My previous website only shows the home page when the home tab is clicked, then if you click my navbar brand, it says 404. This website worked on a create-react-app with npm start, but it doesn't work here, nor on the build. I don't know what is…
Amodh
  • 367
  • 1
  • 3
  • 16
20
votes
5 answers

ReactJS: [Home] is not a component. All component children of must be a or

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 component. All component children of must be a…