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
1
vote
1 answer

react router dom fallback route with no layout

I have the following routes
Mark Lai
  • 121
  • 1
  • 5
1
vote
1 answer

react-router Cannot read property 'push' of undefined?

some code of index.tsx: ReactDOM.render( , document.getElementById('root') as HTMLElement ); some code of App.tsx interface AppProps{ history?:…
cc shen
  • 145
  • 1
  • 2
  • 12
1
vote
0 answers

Can't implement react redirect with loader-spinner

I have a problem with redirecting and loader-spinner. So I need to redirect the user to dashboard page if logged in. Actually, I can implement redirect, but also I need to run some loader because before redirecting, the login page is visible about…
1
vote
0 answers

react-router v4 - How to change only one part of the URL path and leave the rest untouched?

I have a React - Redux - React Router v4 application in which the URL looks something like this: www.mysite.com/:accountName/brands/:brandId/something www.mysite.com/:accountName/brands/:brandId/somethingElse An actual example would…
nikjohn
  • 16,079
  • 9
  • 45
  • 78
1
vote
0 answers

Handle recurring param in react router path

react-router-dom 4.3.1 Given a route like Is :repeatingParam+ the best way to handle a param that will repeat many times? Incase you're wondering why, I'm attempting to model…
James
  • 3,139
  • 2
  • 17
  • 22
1
vote
1 answer

React-Router-Dom No effect when clicking

Presently I'm having an issue with my Navigation bar. When I click it it does not even change the URL address. Note: I'm just using the lastest version of react and react-router-dom": ^4.4.0-alpha.1. No redux here. Here is the index.js import React…
Lullaby
  • 97
  • 2
  • 11
1
vote
1 answer

React HashRouter not rendering other paths, only Rendering root component '/'

My Setup: routes.js const Router = () => ( ); index.js app.js: lass App extends…
Rahul Sagore
  • 1,388
  • 20
  • 39
1
vote
1 answer

react-transition-group v2 and react-router-dom v4. Why animation change the data in both: inner and outer components?

I have a simple test stand of code, where we can see how the react-transition-group .v2 works unnormally with animations in navigation between paths via react-router-dom v4. Test stand: https://codesandbox.io/s/oxkw5prm56?from-embed Typically, this…
1
vote
1 answer

React Component does not render when clicking CardActionArea from Material UI

I'm running into a weird issue that I've never run into before. I'm using Material UI components, specifically CardActionArea paired with Redirect from react-router-dom Upon clicking the CardActionArea I want to redirect my users to a detail…
ILikeTacos
  • 13,823
  • 16
  • 52
  • 81
1
vote
1 answer

react router 4 "Not Found" page with nested routes

Let's say I have these routes: Handling 404 page works okay if I type anything other…
mcmxc
  • 376
  • 4
  • 17
1
vote
1 answer

react-router-dom error when refreshing page with id

I'm developing a project using React/Redux and Node.js. I added react-router-dom as a dependency into my project and configured the router like this: import ... const Router = () => (
1
vote
1 answer

Netlify redirection doesnt update my path

Whenever I refresh a page on my deployed netlify site I'm being redirected (as planned) to the main page. But the url path itself doesnt change. Is it something I need to set in the .toml file or its something with my react routes? I'm…
ueeieiie
  • 1,014
  • 10
  • 33
1
vote
1 answer

React Router - NavLink activeStyle or activeClassName not working for nested routes

I'm using react-router-dom. In my code, NavLink fails to apply activeStyle or activeClassName not even on page load/reload. I've nested routes but not using redux. Sample Code: Stackblitz react-router-dom version: 4.3.1 index.js: render() { …
Abdul Rafay
  • 2,793
  • 2
  • 21
  • 40
1
vote
1 answer

React Router with Node JS

When using React-Router, you only serve up the original index.html with Node because the client handles the rest. I understand how to route between different pages once the user is at the home page. However, let's say the user types in the URL…
1
vote
1 answer

react-router-dom+antD/ How to set a Nav Element Active as per the current route

I Created the following NavBar import React,{Component} from "react"; import { Layout, Menu ,Icon} from 'antd'; import {NavLink} from 'react-router-dom'; const { Header } = Layout; const SubMenu = Menu.SubMenu; class NavBar extends…