React router v4 - Как получить текущий компонент в реагирует маршрутизатор

Question

Есть ли способ в реагирующем маршрутизаторе получить текущий компонент на коммутаторе?

const routes = {Home, ...}

<Layout>
  <Switch>
    {routes.map(r => <Route path={r.path} component={r.Component} />)} // I want to get this Component
  </Switch>
</Layout>

function Layout(props) {
   // I want to get the current component here
   return props.children
}

Answer 1

Используйте props.match, чтобы получить текущий активный маршрут.React-маршрутизатор обеспечивает это.

Многие статьи объясняют, как его использовать, вот одна из них: https://jaketrent.com/post/access-route-params-react-router-v4/

Answer 2

Вы можете различить тип элемента по API React.Children

Но я рекомендую использовать Context API.Context API создан для таких вещей.

Context API: Context provides a way to pass data through the component tree without having to pass props down manually at every level.