Category "react-router-dom"

How to use MemoryRouter in order to test useParams call

I have a hypothetic React component named Component.ts with a code structure similar to that: import React, { FC } from 'react'; import { useParams } from 'rea

Linking components in React using React Router Link not working

I am new to React and I am creating a portfolio web page in which I am trying to connect two components with the Link component in react-router-dom (similar to

Render the detailed page when clicking on a linked item on the sidebar menu

I am working on the sidebar. Currently, I have a few items on my sidebar. When I select an item, it shows a few details on the main area. Actually, I have a lar

How can I apply React Router v6 and react-transition-group transition to only specific routes?

what can I do if I want to exclude some 'routes' from the transition? For example, the routes are as follows; <Routes> <Route path="/login" element={

Link tag inside BrowserRouter changes only the URL, but doesn't render the component

I am building a Netflix clone application, and I am using react-router-dom v5 to switch between different pages. However, when I click the Link tag in Navbar.js

React + Material UI - Best way to prevent child tree from remount when toggling parent theme

Background I wanted to follow Material UI's implementation of toggling UI's dark/light mode theme. Link. I have encapsulated its implementation into a custom ho

"React does not recognize the prop on a DOM element" in React Router

React does not recognize the computedMatch prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowerc

Passing state to another component

In my MUI Table I navigate the user to another page when is clicked over the row. Is there a option to pass the data from the row directly with useNavigate, ins

React-router HashRouter When redirecting root URL with query parameters, route gets appended after params

I'm having the following issue. I am implementing SSO which, after successful sign in, redirects the user to the root uri with the access_token as a query param

Imported components transformed into "/static" urls in react-create-app

I'm having an issue I can't really find any previous answers to or documentation about. I'm loading a component, in a module, on my local machine, "login.jsx,"

React-Router-dom and useHistory. Pushes new URL to history and changes URL but page does not change [duplicate]

I am to create an app which utilizes react-router-dom. I am currently trying to us eversion 5.2.0. I have tried to isolate the issue and focus

React link's onClick event state change is not happening

I have used react links with mui and I am trying to highlight the active link in header. My attempt is as below. import Link from "@mui/material/Link"; import {

React Router target div id in home page

I am using react router specifically the HashRouter since I am trying to host my react app on github pages. Prior to using the HashRouter I was just using the B

How to protect reactjs resources with spring boot based authentiation?

My current project state: I am working on a Web Application with ReactJs (frontend) and spring boot (backend). When I deploy this application, I package react

How to protect reactjs resources with spring boot based authentiation?

My current project state: I am working on a Web Application with ReactJs (frontend) and spring boot (backend). When I deploy this application, I package react

React-router-dom Prompt: Iframe within a page gets unloaded/loaded [closed]

I am working on a react spa to show alert on unsaved form changes. I am using [email protected] Prompt Component for this use-case. The p

./src/App.js Attempted import error: 'Switch' is not exported from 'react-router-dom'

I can't figure it out why doesn't work. I have uninstalled the react-router-dom package and reinstalled it, but I always have the same error. The error I'm gett

Alternative for Prompt in React Router V6

What is the alternative for Prompt in React Router V6, has it been deprecated, and also hooks like usePrompt, useBlocker are also not available. <Prompt mess

ReactJS: [Home] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>

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 applicatio

Config route in react-router-dom v6

I am using react-router-dom with typescript. I create a config file like below: export interface RouteComponent { path?: string; element?: React.ComponentTy