Why I receive blank page? React

by

In react-router-dom@6 the Route components render the routed content on the element prop as a ReactNode, i.e. as JSX. There is no longer any component, or render and children function props.

Routes and Route

declare function Route(
  props: RouteProps
): React.ReactElement | null;

interface RouteProps {
  caseSensitive?: boolean;
  children?: React.ReactNode;
  element?: React.ReactNode | null;
  index?: boolean;
  path?: string;
}

Move the components into the element prop and pass them as normal JSX instead of as a reference to a component.

<Router>
  <Routes>
    <Route path="/" element={<Home />} />
    <Route path="/wallet" element={<Wallet />} />
  </Routes>
</Router>

More Related Contents:

  1. How to render an array of objects in React?
  2. Nested routes with react router v4 / v5
  3. Pass props in Link react-router
  4. react router v6 navigate outside of components
  5. Problem in redirecting programmatically to a route in react router v6
  6. React Router with optional path parameter
  7. Use anchors with react-router
  8. React react-router-dom pass props to component
  9. Uncaught TypeError: Cannot read property ‘push’ of undefined (React-Router-Dom)
  10. Active link with React-Router?
  11. Using anchor tags in react-router 4
  12. Multiple Nested Routes in react-router-dom v4
  13. How to hide navbar in login page in react router
  14. How do I reload a page with react-router?
  15. How is this type annotation working in React code without TypeScript?
  16. React-router: How to manually invoke Link?
  17. React-router – How to pass data between pages in React?
  18. React-router v4 – cannot GET *url*
  19. ReactJS: [Home] is not a component. All component children of must be a or
  20. Detect change in query param react-router-dom v4.x and re-render component
  21. How to restrict access to routes in react-router?
  22. Material-ui adding Link component from react-router
  23. How to use normal anchor links with react-router
  24. React router global header
  25. React – How to open PDF file as a href target blank
  26. React: ‘Redirect’ is not exported from ‘react-router-dom’
  27. React Router BrowserRouter leads to “404 Not Found – nginx ” error when going to subpage directly without through a home-page click
  28. On React Router, how to stay logged in state even page refresh?
  29. How can I redirect in React Router v6?
  30. ReactJS Bootstrap Navbar and Routing not working together

Leave a Comment