Questions tagged [react-router-dom]
Use this tag for questions regarding DOM use and bindings of React Router v4, v5, and v6.
react-router-dom
7,808
questions
1
vote
2
answers
26
views
How to prevent scroll-to-top on certain links in React-Router with a custom ScrollToTop component
I'm using React-Router with a custom ScrollToTop component to reset the scroll position to the top of the page on navigation. However, I have a specific use case where I need the scroll position to ...
- 39
-2
votes
1
answer
31
views
React router not running [closed]
in this code my first component is running correctly but the second one (ProuductList) is not showing up on the screen at all, any ideas?
import { Route, Routes } from "react-router-dom";
...
0
votes
1
answer
24
views
I'm trying to open a component from header. I tried Routes. When I click on the linked icon, it adds /componentName to local host and nothing happens [duplicate]
App.js
import Heading from './Components.js/Heading.js'
import './App.css'
function App () {
return (
<div>
<Heading />
</div>
);
}
export default App
index.js
...
- 1
1
vote
0
answers
29
views
Issue with useNavigate and useBlocker in createBrowserRouter Setup [duplicate]
App.tsx
const createRouter = (user: User | null, isChair: boolean) =>
createBrowserRouter([
{
path: pagePaths.home,
element: user === null ? <Login /> : isChair ? <...
- 45
1
vote
2
answers
44
views
useLocation Hook Error: "useLocation() may be used only in the context of a <Router> component" in React Application [duplicate]
I'm developing a React application and I'm encountering an error when using the useLocation hook from the react-router-dom library. The error message I receive is:
Error: useLocation() may be used ...
- 57
-1
votes
0
answers
38
views
Trying to Implement Authorization Routes in React using react-router-dom v6
I am trying to implement a protected route system through the use of a context that holds the data to be kept in mind in order to give access to said routes.
The way I am checking these files ...
- 43
-1
votes
0
answers
32
views
I have been trying to implement the unstable_usePrompt, but it's giving me an error: useBlocker must be used within a data router [closed]
I am working on a Multi-Page-App, so while working on a form and trying to stop information from being lost if the user clicks on the previous page. I have been getting an error that useBlocker must ...
0
votes
2
answers
37
views
Url is changing but page is only appearing after reloading [duplicate]
import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Onboarding from './components/Onboarding/Onboarding';
import Login from './components/Login/...
0
votes
0
answers
19
views
React useState hook is not updated [duplicate]
When I run my frontend and backend, Axios makes a request to the specified route and logs the status of the response as '200' to the console. However, even after that, the 'auth' state does not update....
-1
votes
0
answers
22
views
How to enable react client side routing with nextjs static export SPA?
I have built a single-page app using Nextjs and it is exported as a simple static page which means no server-side rendering or Node.js backend, so everything runs on the client side as soon as the ...
- 1,356
-1
votes
0
answers
29
views
How to Render a Modal Route on Top of Current Page Content Using React Router?
I'm working on a React application where I need to render a settings modal on top of the current page content when navigating to the /setting route. I want the modal to overlay on top of whatever page ...
1
vote
1
answer
32
views
Mixing useNavigate with useHistory in React
In my current workplace, the project that I am supposed to work on has used useHistory up to now. I know that in newer versions it is usually better to use useNavigate. Would it be okay (non-breaking) ...
- 155
0
votes
1
answer
36
views
Webpack React Router DOM build issue
I have a React+Typescript app with Webpack 5 configuration that was built from scratch. For routing I use React Router DOM 6.23.1. In development mode routing works as expected, but after I build the ...
- 59
1
vote
3
answers
118
views
Pagination is not working properly using React-Router DOM
I am trying to implement pagination for components named "Shop", Contact and Cart using react-router-dom.
To store the URL paths I have used an array.
A state variable is used as an array ...
0
votes
0
answers
38
views
Why do I get errors when I want to go to the Navigation where there is a Hashlink? [duplicate]
Errors
App.jsx
import React, { useRef, useEffect, Suspense, Fragment } from "react";
import { useSelector } from "react-redux";
import { BrowserRouter, Routes, Route } from "...
- 3