[Solved]-React router v6: how to get relative index path in component?-Reactjs

It seems all you need in the Teams component is to navigate to the route's path it's rendered on. For this you can navigate to ".".

Example:

const Teams = () => {
  const navigate = useNavigate();

  return (
    <div>
      Teams
      <Outlet />
      <button onClick={() => navigate(".")}>Back to Teams</button>
    </div>
  );
};

Consider routes:

<Routes>
  <Route path="/">
    <Route path="teams" element={<Teams />}>
      <Route path=":teamId" element={<Team />} />
    </Route>
    <Route path="settings" element={<Settings />}>
      <Route path="advanced" element={<Advanced />}>
        <Route path="edit-teams" element={<Teams />}>
          <Route path=":teamId" element={<Team />} />
        </Route>
      </Route>
    </Route>
  </Route>
</Routes>

A Teams component is rendered on "/settings/advanced/edit-teams", so navigating to "." will navigate to this path.