How to make a redirect from a parent component to a child?

Question

React

react-router-dom 6.2.1
There is such a route with two children:

<Route path="/companies/:company/:meeting" element={ <Meeting /> }>
      <Route path="resolutions" element={ <Resolutions /> } />
      <Route path="participants" element={ <Participants /> } />
</Route>

Inside the Meeting component there is a navigation and an Outlet:

<>
    <Tabs routes={ tabsRoutes } />
    <Outlet />
</>

The Tabs component contains navigation through child components, and I need to immediately redirect to Resolutions when I go to the Meeting page, i.e. from '/companies/1/3' to '/companies/1/3/resolutions'. How to do it?

I know that the sixth router has a redirect component - Navigate, but it requires a specific url string, and in my case some parts of the url are dynamic. Probably, some action is needed with the useNavigate hook inside the Meeting component, but due to the low competence in React, I can’t figure out exactly how to do it.

Answer 1

Understood. Inside the parent (in my case - Meeting) you need to use

const navigate = useNavigate()
useEffect(() => {
    navigate('./resolutions', { replace: true })
}, [])