☰

React Router v4 - 現在のルートを取得するにはどうすればいいですか? 質問する

tag-icon • tag-icon reactjs react-router react-router-v4
React Router v4 - 現在のルートを取得するにはどうすればいいですか? 質問する

現在のルートから何らかの方法で渡されたtitleinを表示したいと思います。<AppBar />

React Router v4 では、<AppBar />現在のルートをそのtitleプロパティに渡すにはどうすればよいですか?

  <Router basename='/app'>
    <main>
      <Menu active={menu} close={this.closeMenu} />
      <Overlay active={menu} onClick={this.closeMenu} />
      <AppBar handleMenuIcon={this.handleMenuIcon} title='Test' />
      <Route path='/customers' component={Customers} />
    </main>
  </Router>

propカスタムからカスタムタイトルを渡す方法はありますか<Route />?

ベストアンサー1

react-router の 5.1 リリースには、現在の場所オブジェクトを返すuseLocationというフックがあります。これは、現在の URL を知る必要があるときにいつでも役立ちます。

import { useLocation } from 'react-router-dom'

function HeaderView() {
  const location = useLocation();
  console.log(location.pathname);
  return <span>Path : {location.pathname}</span>
}

おすすめ記事