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
2
votes
0 answers

react-router v6 removes useHistory, but useNavigate misses implementation

I have a scenario where we have a CustomHistory object, it's a hack in an electron application, so that certain routes are not stored in the history. Previously we would use const customHistory = useHistory() as CustomHistory; This history object…
Perfection
  • 721
  • 4
  • 12
  • 36
2
votes
1 answer

useLocation from 'react-router-dom' returns unexpected object

Note: I'm trying to switch to Plug'n'Play using yarn. useLocation is imported from 'react-router-dom' package. Previously (before pnp settings) the line below: const location = useLocation() always returned a location object with the next structure…
2
votes
1 answer

NavLink react-router-dom not working ( working if refresh page )

I have try to use NavLink in react-router-dom but something not working. Thanks for any help. I'm in Profile page, i click and it change the path to '/adminboard/settings' and activeClassName in Settings but i'm…
Thanh Hải
  • 101
  • 1
  • 7
2
votes
1 answer

React Router: Exclude strings from generic `/:slug` path

I'm attempting to setup the following UI based on routes /things/ - display the list of items (Component A) /things/new - display the list of items, with a modal form overlay (Component A and Component B) /things/:slug - display a specific item…
Brett DeWoody
  • 59,771
  • 29
  • 135
  • 184
2
votes
2 answers

react-router redirect render nothing in protected route

I have protected route named that should redirect and render my component if the user has not completed his onboarding. But the component is not rendering whereas my component is rendering if I'm not logged. I…
r10d
  • 61
  • 8
2
votes
1 answer

How do I handle multiple query params in javascript?

I have a react app and I'm trying to use a table component. This table component has multiple ways of filtering the table, and I want to be able to update the URL with these filters so that when I navigate away and go back, the table can read from…
nyphur
  • 2,404
  • 2
  • 24
  • 48
2
votes
1 answer

Header component doesn't get updated after route change

I am trying to understand why Header component doesn't get updated when I click Button. I believe that the problem is that I am not calling with Router. But why then App.js doesn't re render when I switch routes? import React, { useEffect } from…
Sonny49
  • 425
  • 3
  • 18
2
votes
2 answers

How to create seperate component just for routes using react router?

like the title says I need to create separate component where I will store routes for my project. This is what I have done in App.js component:
ahmedskulj10
  • 381
  • 1
  • 15
2
votes
1 answer

React-Router Redirect in Storybook

I have some components that use Redirect (from react-router-dom) in certain scenarios. It seems that Storybook does not like this even though I wrap my story with a router decorator. Does anyone know how to make Storybook work with Redirect? The…
Javier Guzmán
  • 1,014
  • 2
  • 13
  • 27
2
votes
1 answer

Deploying react project to github pages face problem for image in public folder

I have encountered trouble in deploying my react js project on Github. In short, the javascript in HTML file is working well, but all the images and PDF file I put in the public folder seems unread by the server. Those images and PDF file existed in…
2
votes
2 answers

Navigate in react using react-router-dom 6

I am working on a React app where I am trying to navigate from a loginform to the homescreen of my app using an onSubmit function. This is what I have so far. In my formik form im trying to pass the email value when the form gets submitted. After…
John
  • 97
  • 1
  • 7
2
votes
1 answer

How can I exempt some routes to not hit 404 error if the URL don't match as exact?

I have an app layout like this: function App() { return (
Faisal Nazik
  • 2,367
  • 4
  • 17
  • 40
2
votes
3 answers

pass data through link when button is cliked in react js

I am trying to pass dataFromParent={date} to in navigator.js when the edit button is…
vivek kn
  • 107
  • 1
  • 18
  • 45
2
votes
1 answer

react-router-dom(^5.3.0) -> redirect

use Chrome to access ULR : '/home/page1' . (visit '/home' can turn to '/home/page1') This can't render
王逍遥
  • 41
  • 4
2
votes
2 answers

Set active link in React Router based on current path

Using React Router and Material UI, I'm trying to set the navigation item selected state based on the current URL path. If a user comes to a specific page, it should set the selected state of the appropriate link in the sidebar. This is the current…
Matt
  • 1,561
  • 5
  • 26
  • 61
1 2 3
99
100