Skip to main content
20,572 questions
Newest Active Bountied Unanswered
Filter by
Sorted by
Tagged with
0 votes
2 answers
50 views

How to display <NavLink> components inside the Footer? I cannot place the Footer inside RouterProvider. The Footer component should be displayed on every page. function App() { const router = ...
stot's user avatar
  • 1,137
Advice
1 vote
2 replies
67 views

I'm migrating an app from React Router v6 + Webpack to React Router v7 (SPA mode) + Vite and I'm having issues with setting a strict Content Security Policy. In RR6 I had a normal index.html and ...
tykhan's user avatar
  • 131
1 vote
1 answer
56 views

I'm trying to implement a redirect based on a property passed to a component nested deep within my route hierarchy. Right now I know 2 options how to do it. const MyComponent = ({ variable }: { ...
Jan Krakora's user avatar
  • 2,630
Tooling
0 votes
3 replies
60 views

I want to use react-router-rom and can we still use react-router-dom V5 in today's date? since it support custom route components, while react-router-dom V6+ has strict rules to use Route & Routes....
Shreyas H's user avatar
  • 127
0 votes
0 answers
19 views

I have a app where I am using JWT authentication. When I enter the details and click on the register button, the backend API correctly returns the token but in my console the token stays only for some ...
Ashley Ferns's user avatar
  • 93
2 votes
1 answer
84 views

I need to define user pages (Home, Cows, Reports, …) once and make them accessible to AppUser + Admin under "/" with UserLayout, and also accessible to Admin under "/admin/user/*" ...
Ahmed Alawneh's user avatar
  • 11
3 votes
1 answer
80 views

I'm using react-persist in my application. When I click to add a product to my basket and then want to navigate to my basket page, how do I pass the basket data to the fetch function in the loader ...
redoc01's user avatar
  • 2,527
1 vote
1 answer
246 views

I'm trying to incorporate React Router into my Firefox browser extension to be able to display different pages in the extension's popup window. However, I keep getting the warning, You should call ...
Fluffy the Togekiss's user avatar
  • 325
3 votes
1 answer
104 views

I'm having issues configuring react-router-dom with nested routes loaded by sub-modules. In my application I need to dynamically load modules that have their own nested routes. One of the requirement ...
cef62's user avatar
  • 43
0 votes
0 answers
70 views

The reactJS client has left pane for menu and right for content. The react-route-dom 7.6.3 is used to create route in App.js as below: const router = createBrowserRouter([ { path: "/...
user938363's user avatar
  • 10.3k
4 votes
1 answer
283 views

I currently have a React Router v7 application running in SPA mode. I wanted to make an API route that uses a clientAction to submit data to an endpoint. If I use the useSubmit hook, I can ...
Sammi's user avatar
  • 51
-3 votes
1 answer
233 views

I'm trying to migrate an existing React/Vite app (currently using React Router v7, along with redux, rtk-query, and redux-persist) to use React Router v7 in Framework mode. I'm hitting an error when ...
drosboro's user avatar
  • 451
0 votes
1 answer
123 views

I have problem with my React app, using Vite and React-Router v7, in framework mode, ssr: false. When using dev mode, all styles are being applied correctly (I'm using moduled SCSS, and one global app....
dsadad's user avatar
  • 23
2 votes
0 answers
137 views

I'm using React Router v7 with BrowserRouter and need to navigate back multiple steps in browser history, then replace the resulting route atomically. My current approach causes a race condition where ...
Tekodaf's user avatar
  • 37
1 vote
1 answer
613 views

I just want to redirect one path to another. If I have something like this in my routes.ts: export default [ index("Home.tsx"), route("/about", "About.tsx"), ] ...
Matthew Wilcoxson's user avatar
  • 3,662
2 votes
3 answers
232 views

In react-router, there is a hook to retrieve path parameters, for example "/users/:id" where the code can access the id value. In this example :id is a slug for a path parameter, and within ...
Apoqlite's user avatar
  • 309
2 votes
1 answer
81 views

Routes.ts import { type RouteConfig, index, route, layout } from "@react-router/dev/routes"; export default [ layout("layouts/main_layout.tsx", [ route("...
malle2002's user avatar
  • 23
-3 votes
2 answers
277 views

Here is an example routes.tsx file for my React-Router v7 application import { type RouteConfig, index, prefix, route } from "@react-router/dev/routes"; export default [ index (&...
Steve Brownell's user avatar
  • 1,322
-3 votes
1 answer
101 views

Is it possible to configure routes in React Router that match URLs starting with . and @? I have this in routes.ts: export default [ route('.:param', "routes/dotroute.tsx"), route('@:...
Vasyl Nekohda's user avatar
  • 193
0 votes
0 answers
23 views

Body I'm building a kids' poem and story website using React and Supabase. I have successfully implemented login/signup using Supabase auth. What I'm trying to do: I want to restrict access to certain ...
Gorja Poornima's user avatar
  • 1
-3 votes
1 answer
100 views

I'm implementing protection route in my vanlife practice project and its not redirecting me it keep giving me this error when i try to access protected route I'm supposed to get redirected to /login ...
dipanshuu447's user avatar
  • 15
-1 votes
1 answer
555 views

I am experiencing an issue after upgrading to React-Router version 7.6.2. I was able to replicate the failure: StackBlitz. Note that this test passed when I had v6 of React-Router-DOM. The problem ...
Zlatan Sadibasic's user avatar
  • 117
0 votes
1 answer
83 views

I have a React router version 7^, app with in framework mode (It was a Remix 2 app that I upgraded to React router). Now I'd like to have a page with a loader and an action to be on two different ...
Chen Peleg's user avatar
  • 3,190
3 votes
1 answer
116 views

From docs: https://reactrouter.com/6.30.1/route/route Type declaration interface RouteObject { path?: string; index?: boolean; children?: RouteObject[]; caseSensitive?: boolean; id?: string;...
Александр Кос's user avatar
  • 160
3 votes
1 answer
2k views

I can't figure out how Vite and React Router (v7 Framework) are supposed to work together with a base path. In my vite.config.js I'm using base: '/my-app/'. If I use /my-app instead, then the build ...
Aaron Beall's user avatar
  • 52.6k
0 votes
0 answers
35 views

I'm using React Router to implement protected routes in my application. Everything works as expected in terms of redirecting unauthorized users — they get sent to the login or access-denied page ...
Naim Cheddi Elkhattabi's user avatar
  • 1
0 votes
2 answers
140 views

I've been working on a React project where I use react-router for navigation. My code works perfectly with react-router v7.4.0, but after upgrading to v7.5.3, I'm encountering a TypeError: Cannot read ...
NAVEED's user avatar
  • 127
2 votes
1 answer
779 views

I have created a React-Router framework mode app like this: npx create-react-router@latest my-react-router-app The version of React-Router is: "react-router": "^7.5.1" In routes....
RajV's user avatar
  • 7,272
3 votes
2 answers
171 views

I would like the ProtectedRoute to call server and get a response that indicates whether the user is logged in or not, on every render of a page that it protects. The server is sent a session cookie ...
user3146945's user avatar
  • 307
0 votes
0 answers
15 views

I have a React App that uses the username throughout the app so it is declared in App.tsx let [username, setUsername] = useState<string>(""); and I pass that as a property to all my ...
Ro Anders's user avatar
  • 103
1 vote
1 answer
56 views

I have a CSR app with the following route definitions: const router = createBrowserRouter([ { path: '/app/', element: <NavBar />, loader: navBarLoader, children: [ { ...
Gambit2007's user avatar
  • 4,042
0 votes
0 answers
22 views

I'm currently developing a project utilizing React Router v7 framework where I need to implement protected routes. While I've successfully implemented the protection mechanism, I'm encountering an ...
PROFESSOR MR's user avatar
  • 3
2 votes
1 answer
627 views

I'm using React Router V7 in framework mode. The goal is to put all related pages in a common folder, so that routes file doesn't extend linearly. We have a few namespaces: public, organization, ...
Mark Swardstrom's user avatar
  • 18.3k
-1 votes
1 answer
220 views

I have a heading in Layout and I want to pass props to it. So I can start my <main> element. Here is my Layout.tsx <> <h1>{title}</h1> <main> <Outlet /> {/* ...
MPK's user avatar
  • 69
1 vote
3 answers
85 views

I was learning and practising tutorial on mern stack, by watching a video on youtube but nothing is displayed since I have added the Routes. White page. Is there anyone who get an idea what is wrong. ...
swiftboy's user avatar
  • 29
0 votes
1 answer
62 views

I have an app that has a 3 JSX files: one for controlling states import React from "react"; import CreateRisk from "./CreateRisk"; import TablePage from "./TablePage"; ...
Aleks3000's user avatar
  • 33
1 vote
1 answer
49 views

I have the following routes defined in react-router-dom <Route id='editor' path='editor' > <Route index element={<Editor />} /> <Route id='edit' path='edit/:documentId' ...
Greeso's user avatar
  • 8,429
1 vote
1 answer
74 views

I try to implement an overflow in Form react-router, that's work in a classic <div></div> but when I use <Form></Form> my overflow doesn't work. I don't find any topic who talk ...
Knupel's user avatar
  • 373
-2 votes
1 answer
95 views

After a lot of trial and error I cannot get RTL to render any components from react-router-dom. I am using [email protected], @testing-library/[email protected], @testing-library/[email protected], react-router-...
rdn's user avatar
  • 1
-2 votes
2 answers
77 views

The goal is to save a form before user leaves a page. Before we switched to react-router v.7 from v.5 we used history package, which is compatible with react-router only up to v.6. The code we used in ...
user2789261's user avatar
  • 47
1 vote
1 answer
113 views

In my React code I have these 2 files in App.js and Users.js. By using Routes just for fun and experimenting to render some random text, I have 3 routes that have the same path and components but ...
Oh Oh's user avatar
  • 45
-4 votes
1 answer
241 views

Using createMemoryRouter to create router to render doesn't work. It renders and error page. import { vi, describe, it, expect } from 'vitest' import { render } from '@testing-library/react' import { ...
vatsal chauhan's user avatar
  • 101
1 vote
1 answer
533 views

I use React Router v7 as a framework. I don't understand why posting data with a fetcher triggers a full page reload. I might be mistaken but to my understanding, it should just post the data, reload ...
JuCachalot's user avatar
  • 1,038
-1 votes
1 answer
408 views

Material UI has a component called PageContainer which provides a title and breadcrumb navigation as shown here: https://mui.com/toolpad/core/react-page-container/ I want to navigate to the same place ...
user3217883's user avatar
  • 1,485
1 vote
2 answers
285 views

The error happens when I refresh the page or navigate between "/account", "/account/bookings", and "/account/places". import React, { useContext } from 'react'; import { ...
neyuj_11's user avatar
  • 19
0 votes
1 answer
446 views

I'm trying to create a scenario for migration of React-Router from version 6 to version 7. I have followed the migration steps of the documentation but the routing is not working. I'm stuck and can't ...
Apostolos's user avatar
  • 10.5k
-1 votes
3 answers
75 views

I am currently stuck in passing paramters to another route using navigate() function. MainPage.js: After an API call the value for the below used objects will be obtained const navigate = useNavigate(...
SM079's user avatar
  • 797
2 votes
1 answer
95 views

I'm trying to get Material-UI Breadcrumbs to work with React-Router. There is an example on the MUI site: import * as React from 'react'; import Box from '@mui/material/Box'; import List from '@mui/...
user3217883's user avatar
  • 1,485
-1 votes
1 answer
70 views

I’m adjusting some functionality for a React app (using React 16.13.1) with React Router v5 and HashRouter. My app displays a list of coupons in a table (using AgGrid) within a component (named ...
Varikash Nikolay's user avatar
  • 17
2 votes
1 answer
1k views

I tried reading the React Router 7 documentation, but can't seem to find a solution to my issue. So in my React Router 7 Node.js/Express app, I have a loader function for the client, to fetch location ...
Lushmoney's user avatar
  • 530

1
2 3 4 5
…
412