Stack Overflow
Stack Overflow

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

3682 questions
10
votes
3 answers

Styling react-router-dom Link using styled-components getting warning when passing props

import styled from 'styled-components'; import {Link} from 'react-router-dom'; const LS = {}; LS.NavFixedItem_LINK = styled(Link)` display: flex; justify-content: ${props => props.tempLeftProp ? 'flex-start' : 'center'}; align-items:…
cbdeveloper
  • 14,014
  • 11
  • 57
  • 145
10
votes
4 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
  • 5,490
  • 3
  • 47
  • 97
10
votes
3 answers

dynamic basename with BrowserRouter in react-router-dom

Please I have an issue building a multi-tenant SaaS solution. For every tenant, I want them to use a subdomain, so i can get the subdomain from the url, make a call to a REST api that returns data about that tenant. For example, the admin…
Lateefah
  • 505
  • 5
  • 11
10
votes
2 answers

Nested React Router : hide parent component on showing nested child component

Being a beginner in reactJS, I want to know how to hide parent component when i route to child component URL Assume a scenario: User is at "/house" as this: when user clicks a house grid he navigates to…
Efrain Sanjay Adhikary
  • 301
  • 4
  • 22
10
votes
5 answers

React Redux state is lost at page refresh

in my react app I have 3 components. from the 1st component by a button, I use Link to go to the 2nd component. at the 2nd I create a state (redux store), manipulate it and when manipulation is finished by submitting button I redirect to the 3rd…
Amir-Mousavi
  • 3,249
  • 4
  • 40
  • 86
10
votes
1 answer

Bugs in Sidebar Menu with React Router V4

I'm developing a single-page ReactJS Web app but I know I'm doing something wrong while defining my routing with React Router V4. My problem is as follows: PrivateRoute in my routes.js file is not working as expected. That is, I don't know why but…
Julia
  • 489
  • 5
  • 18
10
votes
2 answers

Order of Provider and Router in React app

I'm making my React app a SPA and adding React Router 4 with react-router-dom to it. Currently, my entry point to my home component looks like this: render ( …
Sam
  • 19,814
  • 35
  • 141
  • 272
10
votes
3 answers

How do I send custom data in react-router goBack method like push and replace methods?

I am using react-router-dom v4 and able to send custom data to the new screen using push(path, state) and replace(path, state) methods in "props.history.location" I want to send the data back to the previous screen but could not achieve using go(n)…
Ram Babu
  • 1,849
  • 3
  • 21
  • 27
10
votes
4 answers

react-router-dom: getting props.location from within component

I have a simple App that uses BrowserRouter from 'react-router-dom' v4. I'm trying to access the location.pathname property from within the component, without avail: class App extends Component{ render(){ return ( …
Marquizzo
  • 17,230
  • 9
  • 36
  • 59
10
votes
4 answers

React Router v4 setting activeClass on parent

Not too familiar with react router, but I need the functionality of the NavLink to set the active class on the parent li element, and not the a element. To implement this I just looked at the source code of the NavLink and copied it to a new…
Kyle Gobel
  • 4,870
  • 7
  • 38
  • 63
9
votes
1 answer

react-router-dom get id from route with custom components and extra path

I have an app that uses a react-router-config and uses a wrapper component to redirect unauthenticated users. I have some functionality that requires the use of the route /tasks/:id but I am unable to access the :id value to perform the necessary…
an00b
  • 142
  • 1
  • 7
9
votes
3 answers

React: reading data passed as parameter in history.push

I am new to react and I am trying to send some data as parameter in history.push. Basically I am calling a method on a button click and inside the method I am calling an api. If I get success response I redirect to other page and I need to pass some…
Molly
  • 1,819
  • 1
  • 15
  • 30
9
votes
2 answers

react-router-dom@4.0.0 requires a peer of react@^15 but none is installed. You must install peer dependencies yourself

I have installed all required libraries using npm install and I also done npm install --save react-router-dom@4.0.0 but I am still getting this error. My Package.json "author": "", "license": "ISC", "devDependencies": { "babel-core":…
Ishan Patel
  • 3,509
  • 6
  • 31
  • 54
9
votes
1 answer

change Url when component renders with react-router-dom?

Is there a way in react router that whenever some components renders the url changes accordingly. One way which I know is to place window.history.pushState('', '', '/componentUrl'); in the render function of the component Is there any better way to…
ashwintastic
  • 1,895
  • 3
  • 15
  • 44
9
votes
7 answers

Create-React-App failed to compile | Import/First Error

I'm currently using Create-React-App for my personal site. I keep getting the following errors every time I run it: ./src/~/react-router-dom/es/index.js Line 3: Import in body of module; reorder to top import/first Line 5: Import in body of…
Catherine Monroe
  • 143
  • 1
  • 3
  • 9
1 2 3
…
99 100