score:3
<Switch>
<Dashboard {...rest} />
<Users {...rest} />
<Quiz {...rest} />
</Switch>
This will not work because Switch expects Route
s to be direct children. It cannot perform its logic on arbitrary wrapper components.
I not sure if that would work but you would have to directly export Route from the module:
Dashboard.js
export default (
<Route exact path="/" render={ props => (
<Dashboard {...props} />
)}/>
)
but when you do something like this:
export default (stuff) => (
<Route exact path="/" render={ props => (
<Dashboard {...props} {...stuff} />
)}/>
)
Notice that you are not exporting a Route
but a functional component that renders Route.
I personally think that you should only export purely components to be rendered without Route
s and leave that up to library consumer.
Source: stackoverflow.com
Related Query
- react router switch route doesn't work gh-pages on github.io
- React Router - route inside route doesnt work
- React Router Switch did not work properly
- React router dom v5 default route doesn't work
- Why react router switch doesn't work when window location changed?
- React Router when passed param doesnt work
- React Router Switch statement with routes grouped as component inside does not go to Not Found route
- React router Redirect does not work when route comes from another component
- React router DOM : Switch not working if child element isnt a route
- React Router v6 and ownParams doesnt work like v5
- React Router doesnt work when I try to render the components
- React exact path in Route doesnt work as expected
- React Router 4 passing props through Route render doesn't work
- React router v4 doesnt work as I want to
- Pass path Param to render() function of Route in Switch - React Router
- React route exact not work if I have child route in React router v5
- Can't render route with switch statements React router dom 5.0.0
- react switch in router is rendering all the route elements that matches
- react router doesn't work in aws s3 bucket
- How to set the DefaultRoute to another Route in React Router
- Firing Redux actions in response to route transitions in React Router
- You should not use Route or withRouter() outside a Router when using react-router 4 and styled-component in react
- React router Switch behavior
- Protected route with react router v6
- React Router - how to constrain params in route matching?
- React Router work on reload, but not when clicking on a link
- How to make react router work with static assets, html5 mode, history API and nested routes?
- React Router v4 - Redirect to same route with different query params
- Default Route With React Router 4
- React Router V4 protected private route with Redux-persist and React-snapshot
More Query from same tag
- Class will not remove using classList.remove()?
- How to manage title, meta tags, etc, inside React with server rendering + streaming?
- How to get rid of "Uncaught SyntaxError: Unexpected token <" in ReactJs?
- How to handle oidc silent renew error
- React start and build gives heap out of memory
- onClick inline function works different from outside function
- Select the exact one cell from table and change state of this
- (React) Margin auto not working for my pagination bar
- Clear Interval on hover React
- DraftJs: Replace an entity using its entity key
- How to prevent UI flickering while conditionally rendering components?
- Require an argument depending on the presence of another argument
- React setState() not updating state after $.ajax() request
- Make Images act like Routers to another page
- react router useparams comes back as undefined
- ReactJS: clickable text - how can I disable click outside the text area?
- Calling a function recursively in the context of "export default"?
- How to do both inclusive and exclusive routing?
- React Tippy - Using method setIsOpen()
- axios , login with api , handle token
- Filter products by the name entered from the input
- How to write sub-component (child components) in es6?
- Re-Render component React
- useContext working not working with nested component
- How to pass table row data as props to another page using onClick event in React Js
- React formik form validation: How to initially have submit button disabled
- Modify function's return value that's passed in as prop to a component
- Material UI Checkbox is repeating the same value twice in one instance
- redux saga selectors, how do I access state from a saga?
- How can I apply background image to card so it would be partly cropped?