i’m trying to run snippet code as below: i want to get the path at Challenges route component but it throw an error: Cannot read properties of undefined (reading ‘pathname’) i try to log variable “a” and “window.location” to test and it log two times like this: My que…
Tag: react-router-dom
React router differentiate between two parameters
I am using “react-router”: “^5.1.2”, and there is a component called CarJourney for which i have created a path like path: ‘/seguro-carro/simulacao/:journeyId?/:userId?’, so as you can see journeyId and userId are optional parameters defined here but i came accros a scenari…
React Router v6 error: All component children of must be a or
The following React routes code probably works in React Router v5, but gives the following error in React Router v6 Error: [Player] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment> Is it possible to update the Routes/Route code so tha…
unable to define navigate = useNavigate()
I’m trying to run this code: but somehow const navigate = useNavigate() gives me Parsing error: Unexpected token Could anyone please help me with this problem? Answer Hooks need to be called at the top level of your React functional component.
On login screen layout keeps showing – React & React router
As I mentioned I have MUI Theme Provider with Layout which includes Dashboard, Order screens … When user hits ‘/’ endpoint it should return Login Screen but Layout keeps showing itself. -App.js ); -Layout.js …AppBar,Sidebar etc Answer As-is, the code is unconditionally rendering a Layo…
Link routes in react changes the link but nothing is changing in the content of the page
I’m trying to make a navbar using react , but although the link has changed , the content never being changed ! routes in my App.js : Home.js file , the content “Home” doesn’t appear , although the link changed: Also the content of Blog.js file doesn’t appear “same as Homel…
Maximum update depth exceeded from Navigate component react-router-dom v6
I’m using react-router-dom v6 to control the route of my React Js app. Here are the specifications: I’m creating the AuthenticationRoute and PrivateRoute components. The AuthenticationRoute component is used to wrap pages that the user doesn’t need to authenticate for examples SignIn, SignUp…
I can’t import Link attribute from react-router-dom
I tried to import Link from react-router-dom & got compile error whether that module is not found. Then I installed it separately. Then got this error. My code: index.js navBar.jsx products.jsx Answer Before you can use the link tags, you first need to create a react router parent called <Routes> (v…
How to delete multiple url params
There is a problem with deleting several string parameters. Only the last parameter is being deleted now. upd: I did not specify that I wanted to achieve the ability to remove specific parameter values this code does not work correctly: Sandbox Answer Solved the problem by modifying the function like this
Please change the parent to
I’m getting this warning in React app: Here is my code: AppBody.js: What I’ve to change in my code to fix the warning? Answer It means that AppBody is rendering more deeply nested routes and the path needs to specify the wildcard * character to indicate it can match more generic/nested paths. reac…