Category "react-router"

How to exclude a page in react app which is using aws amplify authenticator

I am trying to exclude one single page from amplify authenticator that I am using in my react app, but till now I haven't found any way to do so.I have tried wi

React Router works only after refreshing the page

I am a bit new to react and I am facing a problem with the Router. The routing works when I enter the URL directly on the browser, however when I click on the l

React-Quill - addRange(): The given range isn't in document

I am trying to make a simple blog using React-Quill text editor. I want to get the value of the ReactQuill Editor and preview it on a different route. I've been

Redirect Router after loggedin

Am trying to Redirect router to "/", without login it set to Landing.jsx, After login needs to redirect to Homepage.jsx which is also in same route "/". tried u

React router order of routes, does it matter?

I set up my react router like this: <Route exact path="/users"> <component/> </Route> <Route exact path="/users/:id"> <compon

How to implement authentication for the nested routes in React-Router 6?

I am trying to implement authentication for my routes like this using react-router v6 <BrowserRouter> <Routes> <Route path=

React State update with button click from another component

Please read the details below of code enter image description here This MegaMenu Component import MenuIcon from '@mui/icons-material/Menu'; import './MegaMenu.c

React Router 6 in Electron - No routes matched location

I am trying to use react-router v6 in an electron js application. but it doesn't work for me. This App works correctly without implementing the react-router! Wh

Multiple Guard on single route React

Can you put multiple route guards on one route? I'm trying to put two guards (one is auth and other is roleguard) on "/main/dashboard" so that it can only be ac

In React Router v6, how to check form is dirty before leaving page/route

Below are the package versions I'm using. React version - 16.13.1 react-router-dom version - 6.0.0-beta.0 react-redux version 7.2.0 Material UI version 4.11.0

[TypeError: (0 , react_router_dom_1.useParams) is not a function]

I have a component which uses react-router-dom's useParams hook to get params. It is used in my component as : /// Child.tsx const Child = () => { const

Webpack module federation lazy loading remoteEntry.js

Am I able to lazy load apps' entry files when I am using React with ReactRouter? When I enter page there are many requests for remoteEntry.js files for each app

AWS Amplify: DevTools failed to load SourceMap: Unexpected token < in JSON at position 0

I am getting several warnings when loading my website on Google Chrome similar to the following: DevTools failed to load SourceMap: Could not parse content for

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={

How to redirect to external url onClick? in React

I'm using react-router which means i'm storing routes in app.tsx file. I have cards components that need to redirect to an external url onClick. So my question

using react router with next.js

I am learning how to use Next.js/React for my application. I am currently researching the topic of routing and I had a few questions. I know that you can use re

React TypeError: __WEBPACK_IMPORTED_MODULE_0_react__.PropTypes is undefined

I am making a react app using routers and I'm getting the following error: React TypeError: WEBPACK_IMPORTED_MODULE_0_react.PropTypes is undefined How can I a

React router with basename and webpack initial url

Hello i am stuck with this one and couldnt figure it out. So i have React router v6 with basename - "/ui/" , and i want that when i open localhost:8080 that it

Mocking react-router-dom hooks using jest is not working

I'm using Enzyme's shallow method to test a component which uses the useParams hook to get an ID from the URL params. I'm trying to mock the useParams hook so

How to load firebase data before the component renders in react?

I have the following files... useAuthStatus.js import {useEffect, useState, useRef} from 'react'; import { getAuth, onAuthStateChanged } from 'firebase/auth';