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

7372 questions
2
votes
1 answer

Should I be using functions instead of classes for pages in ReactJS?

I've noticed React Router DOM (v6) is now using functions in their help guides in regards to pages instead of using classes. Previously used classes like so: export class Login extends React.Component { render() { return

test

…
Oliver Kucharzewski
  • 2,523
  • 4
  • 27
  • 51
2
votes
1 answer

Redirect in React Router not working when I click from Users to Post

} /> } /> } /> I've just upgraded to React Router v6 and my Redirect…
Chilaxathor
  • 626
  • 1
  • 9
  • 10
2
votes
1 answer

Add a component as props inside a Route with react-router-dom

Having the following code: import { Switch, Route, BrowserRouter as Router } from 'react-router-dom'; export function MyComponent({ list }: MyComponentProps) { return (
Leo Messi
  • 5,157
  • 14
  • 63
  • 125
2
votes
2 answers

React Router v6 Navigate to absolute path from subrouter

Suppose we have this situation: }/> }> }/> }/> …
edoedoedo
  • 1,469
  • 2
  • 21
  • 32
2
votes
0 answers

Highlight the Appbar page when in that specific page

I am trying to add a highlight to the page link that I'm currently looking at in the app bar. but when I add the highlight, it is only highlighting when the link is being clicked but the highlight is disappearing when I got redirected to any page. I…
Jayanth V
  • 49
  • 5
2
votes
2 answers

How to force a route in React

I am trying to follow this SO Answer to "go home" after I close my Modal... import React, { Suspense, useState } from 'react'; import { BrowserRouter, Route, Switch, useHistory } from "react-router-dom"; import './App.css'; import { Button } from…
Randy
  • 1,137
  • 16
  • 49
2
votes
2 answers

React Router v6 onclick

I've asked the same question before but now it's not working with react-router v6. I've simplified the question to how can I output to console when a is clicked? Link in side menu component Entity The route from…
Bradmage
  • 1,233
  • 1
  • 15
  • 41
2
votes
2 answers

How to specify react-router-dom routes in order for matching?

I use react with following dependencies with the specified versions { "react-router-dom": "^5.2.0", "react-dom": "^16.14.0", } and I want to have a route like this Home About Home/Test Home/Test/New <== this is my problem I…
bardia riahi
  • 63
  • 9
2
votes
1 answer

How can I navigate to a nested Route in React Router Dom V6

I'm trying to open a nested Route from within a nav element. The App itself runs under /app (as such I redirect any non existing URL to /app). Within the rendered Layout Component inside the /app Route I'm creating the main navigation as well as the…
Lavariet
  • 497
  • 8
  • 15
2
votes
3 answers

React Router Dom upgrade error - Element type is invalid: expected a string

After installing the latest version v6 getting this error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the…
Samuel T
  • 233
  • 2
  • 12
2
votes
1 answer

Count views every time someone visit the page with firebase and Reactjs

I want to count view every time the user visits the page using react-router-dom and Firebase, I have this Code: //useHistory is the react-router-dom dependency const history = useHistory(); const handleClick = () =>…
Minenhle Solson Cele
  • 81
  • 8
2
votes
2 answers

react router to be used as the child of element error

I created a react app and use react-router-dom for navigation. WHen i wrapp the app.js with BrowseRouter the following error shows. Error: A is only ever to be used as the child of element, never rendered directly. Please wrap your…
Minsaf
  • 272
  • 1
  • 5
  • 14
2
votes
4 answers

React router dom: Route and Router not working at all

I am fairly new to react and trying to make a redirect using react-router-dom I did everything as the documentation but my code doesn't seem to work. I get an error regarding no element found which I don't understand what is causing it. Also, I am…
RevTpark
  • 65
  • 1
  • 8
2
votes
2 answers

react-router-dom not rendering anything in localhost:3000

I am trying to use to render different components based on the URL. My code is in the image. For some reason localhost:3000 is not rendering anything except for when it is loaded up. class App extends Component { render() { return ( …
Keaton Heisterman
  • 33
  • 3
2
votes
1 answer

Property 'type' is missing in type '{}' but required in type 'Props'

** In react-router v6 I am passing element so in typescript its asking for props how i can solve that** } /> } />
Abinash Shasini
  • 41
  • 3
1 2 3
…
99
100