import './App.css'; import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom'; import { useEffect, useState } from 'react'; import MyHome from './components/MyHome'; import Header from './components/Header'; import Footer from './components/Footer'; import CommentList from './components/CommentList' import PostComment from './components/PostComment';…
import React from "react"; import { BrowserRouter as Router, Route } from "react-router-dom"; import Users from "./users/pages/Users"; const App = () => { return ( <Router> <Route path="/"> <Users /> </Route> </Router> ); }; export default App; I tried replacing…
import React, { useContext } from "react"; import { AuthContext } from "../context/auth"; import { Navigate, useLocation } from "react-router-dom"; const PrivateRoute = ({ component }) => { const { user } = useContext(AuthContext); let location = useLocation() if (!user)…
useNavigate() may be used only in the context of a <Router> component. react-router-dom version is ^6.12.0. As shown above in attached image, we have a problem. What do you recommend to do?** Header Merchant button on navbar is not working…
I tried using react-router dom but it is giving me error. Can someone please help me resolving this? Here is the code And I am also enclosing the error which i am getting When i go to the source, I…
I need to have a route that can receive many different path segments dynamically like "https://website/folder1/folder2/folder3" and so on. Each time a user can create a new folder inside another folder and can be navigated to the same component. Basically…
I am working on a web application using React. I'm struggling to redirect a page to another. When I press the button, I can see the direction of the page change, but there is no actual change in the content…
I am using React and react-router. When I try to go to this route <Route path="/blogs/:id" element={<Blog/>} /> from the Blogs page the whole content of the Blog page content is blank and I have a lot of errors. App.jsx…
My App component without the imports: function App() { const { token, login, logout, userId, userEmail } = useAuth(); let routes; if (token) { routes = ( <> <Route path='/' element={<Home />} /> <Route path='profile' element={<Profile />} /> <Route path='organizations'…
My React application compiles properly but only serves a white page. When inspecting in the browser, the following can be seen. Error from inspect page I noticed this error emerging after adding AuthContext for authentication using React Context. index.js import…