I have installed latest react router dom and in package.js its showing "react-router-dom": "^7.0.2".and when i check npm -v react-router-dom its showing 10.9.0. And in my code import React from "react"; import ReactDOM from "react-dom"; import Header from "./components/Header"; import…
How do we manage the behaviour of useParams How it triggers in before or after useEffect import react,{useEffect} from 'react' import {useParams} from 'react-router-dom' export default Slip(){ const {slug} = useParams() useEffect(() => { // In my application role of…
I'm working with React and updated my app to use an overall layout. There are public routes and protected routes. When I changed the code from using children to <Outlet> I'm seeing a black page on when I navigate to…
I am writing a simple web app in React. I'm trying to send data from one page to another using the useLocation hook in React Router, and I can't seem to pass the data. For some reason, despite the value…
i am using the useNavigate in my middleWare.js to redirect the user to '/' but i am gettin this error saying "useNavigate() may be used only in the context of a component" i also tried using window.location.href instead of navigate…
I have a React application where I'm implementing navigation between different pages. Here is the flow I need help with: The user starts on a main page, let's call it Page A. From Page A, the user navigates to a…
Is there a conlict between react-router-dom actions and useForm? For example, I'm exploring an Authentication form from mantine. I want to leverage react-router-dom actions. When I replace form with Form from react-router-dom and trigger the action by clicking Register nothing…
I am using react-router-dom for Routing in my react app. I now want to create a protected route so you can access certain pages only if you are logged in. But at the moment I can still access the protected…
Currently I have createBrowserRouter( createRoutesFromElements(...) ); and nested within there is a: <Route index element={<Navigate to="/raters/start/" />} /> This works fine for the base URL, except that we now need to capture any query strings on the original route and…
Here's a routes I have created so far. <BrowserRouter> <Routes> <Route path="/" exact element={<FrontPage />} /> <Route path="/property-in-:cityName/" element={<PropertyListing />} /> <Route path="/property-in-:cityName/:singlePropertySlug" element={<PropertySingle />} /> <Route path="/associates" element={<AssociateListing />} /> <Route path="/about-us" element={<AboutUs />} /> <Route path="/contact-us" element={<ContactUs />}…