I have another piece of code and want to know the principle of react-router url matching. For example, the following code does not render the Layout component under "/login", which is the effect I want, but I want to know…
I want the header to be rendered when on the home page when the user navigates to "/content", and when they navigate to "/content/about", the About page is rendered without a header. This does not happen. Can you tell me…
i have Routes in the main app and also a Routes in a microfrontend, but it's not rendering the component of the microfrontend routes. The website worked fine until i upgraded from v5 to v6 and update the code according…
I am trying to make my nested route tab active when first displayed but it does not become active unless clicked. If I change anything the parent route becomes inactive. App.js <Route path="account" element={<Account />}> <Route index element={<Profile />} />…
So I want to have one or possibly more Routes in the future to be protected and only accessible if the user is authenticated, but so far I only have the "/dashboard" route as Protected but I when I run…
I want to pass an array as a react-router-dom parameter like so: website.com/[a,b,c]/ this works when I type this directly into the search bar and turn it into an array with the following code: JSON.parse(arrayParam) after which I can use…
I basically need to change the background by clicking Power button in component Header: Header.js import { Link } from 'react-router-dom'; import { faHome, faBars, faChevronLeft, faPowerOff, faBolt } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import App from…
How can I link to the corresponding child React component using Link from react-router-dom? By passing an id to the url. Now I'm getting the id, but the component isn't rendered. https://codesandbox.io/s/test-login-page-tasks-rmfn5j?file=/src/components/Taskslist.js Parent component const ParentComponent = ({ Tasks })…
I have a ReactJS application with basic routing like this import React from 'react' import { Routes, Route } from "react-router-dom" import Global from './global' import Authentication from './authentication' const App = () => { return ( <Routes> <Route path="/"…
I am working on a project which lets users click on Travel Tour "Cards" and be sent to a new page where all details concerning that specific card gets displayed to the user! I have a problem with this specific…