the navigation does not work , the react router is working correctly when i type down the URL manually also the Links const navigate = useNavigate(); function handleForm() { console.log("Form Submitted"); navigate("/"); } <Form onSubmit={handleForm}> ... </Form> To navigate to…
I have created routes for page navigation in React JS, now I want to make some of them protected, like I want some them to be accessible only when user Logged In. const [isLoggedIn, setIsLoggedIn] = useState(false); useEffect(() => {…
<Col xs="9"> <Routes> <Route exact path="/" render={(props) => ( <ProductList {...props} products={this.state.products} addToCart={this.addToCart} currentCategory={this.state.currentCategory} info={productInfo} /> )} /> This is my App.js file. it doesn't work. I looked react-router-dom old version and some place we must replace switch to routes.…
I'm trying to add a button inside the component which is link ()as a whole already. But I want my button to be unlinked but also positioned inside that linked component. I mean when I click on that button it…
I am working on a project which have multiple routes like /profile /admin /home I am fetching posts from backend using Redux Toolkit query in profile page and getting posts successfully but when I go to another page and come…
The Background color of the selected list item isn't changing, only the text color is changing to white. import { NavLink } from "react-router-dom"; import { useTranslation } from "react-i18next"; import { MyContext } from "./links/MyContext.jsx"; import { useContext }…
I'm using react-router-dom version 6.3.0 and I'm trying to make my router handle an updated URL structure. As an example, my old routes look like this: <Route path='animals/dog' element={<Dog />} /> <Route path='animals/cat' element={<Cat />} /> <Route path='animals/bird/songs' element={<BirdSongs />}…
I have the following nest route: createRoutesFromElements(<> <Route path="/:siteid/:route?/login/:cmd?/:id?" element={< LoginLayout/>}> <Route ... /> <Route ... /> <Route path="/:siteid/:route?/login/:cmd?/:id?" element={< LoginPage />} /> </Route> <Route...more routes /> </>) ) But I get the following error: Absolute route path "/:siteid/:route/login/:cmd" nested…
I have a route configured like this: const router = createBrowserRouter([ { path: "/", element: <Layout />, children: [ { index: true, element: <Home /> }, { path: "contacts", element: <Contact /> }, { path: "info/:link", element: <FooterLinks /> },…
I am working on a small e-commerce app using React.js. While setting app the router v6, nothing is rendering. There should be a mistake in the configuring the router even in App.js or Index.js. here is a snapchot from the…