score:1
Accepted answer
you're not really nesting anything with a flat list of routes:
<routes>
<route path="/" element={<main />} />
<route path="tasks" element={<tasks />} />
<route path="tasks/comments" element={<comments />} />
</routes>
but there is nothing wrong/incorrect with doing this.
if you wanted to nest the routes you could do so as:
<routes>
<route path="/" element={<main />} />
<route path="tasks">
<route index element={<tasks />} /> // <-- "/tasks"
<route path="comments" element={<comments />} /> // <-- "/tasks/comments"
</route>
</routes>
Source: stackoverflow.com
Related Query
- React router dom v6, good way for nesting?
- Is there a clean way to conditionally load and render different components for the same React Router route?
- Using condition for redirecting in react router dom v6
- NavLink active on same link for multiple URLs in React Router DOM
- React Router Dom v6 shows active for index as well as other subroutes
- React Router Dom : Warning: Received `true` for a non-boolean attribute `exact`
- how to fetch a nested resource for every component in React router dom route
- How can I add multiple path for home page with react router dom 6?
- router props and custom props with typescript react router dom for functional components
- Nested Route not working in react router dom for my admin dashboard
- React router dom add headers and dashboard for certain routes
- createBrowserHistory is undefined in history import for React Router DOM
- React Router Dom Pathname keeps nesting
- React Good Practices For Handling DOM Elements
- How can I define the route for the following schema in react router dom
- react router dom library doesn't work for my project
- Getting the error of cloning for react typescript and react router dom at props.history.push
- React router dom is working for some component but not working for another component
- React router dom : <Redirect/> is not working for invalid nested path's like localhost:9090/{invalidaa}/{invalidb}/{invalidc}
- Multiple path names for a same component in React Router
- React - getting a component from a DOM element for debugging
- What is the correct way of adding a dependency to react in your package.json for a react component
- Correct way to define an empty dom element in React
- Good way to combine React and Leaflet
- How to configure webpack dev server with react router dom v4?
- Root Navlink always get active class React Router Dom
- How to get params in component in react router dom v4?
- Is there a way to get React to autodefine "keys" for children?
- is there any good Http library for React flux architecture
- React Router with - Ant Design Sider: how to populate content section with components for relevant menu item
More Query from same tag
- React js Semantic Menu items on center
- Unable to get form values in React-Bootstrap's Formgroup Component
- Reactjs - Preselecting options with react-select
- property missing in returned json response / javascript
- ReactJs TypeError default.a.render is not a function
- Maintain the context data for each child component on React router change
- React JS - How do I pass variables (parameters) to the API URL?
- How to properly extend a TypeScriot Interface? There should be only 1 child
- Set onClick if onClick prop given
- How to get value onCahnge event?
- create index.d.ts for read-more-react npm package
- React Native Barcode Scanner Mask
- How to make React params 1 item
- I am getting the following errors saying 'Could not freeze ./node_modules/
- How can I test a React Hooks component by changing useState
- Hiding or not producing axis lines inside first circular grid
- Error in react while importing the function
- How can I declare a two dimensional array in React?
- What's the best way to test the child of a child?
- ReactJs print value of input field
- django-rest-knox with cookies
- How to solve import error for created component in ReactJs
- React stateless functional components defaultProps function
- how to obtain scroll to view inside a div
- Is there a way to tell *WHERE* an action was called within a React/Redux file structure?
- Continue fetching data until result is empty array
- Faced SyntaxError: Identifier expected in React
- Why does setState in this promise take longer to update than the same code as an async function?
- Fetch antd card value onclick in reactjs
- Controlling input values in React (.ts file)