特定の経路で経路を表示しないReact Router Native？

Question

私は、リンクをクリックしたときにAboutコンポーネントが& FooterがルートFooter必見の残りのための&を非表示にする必要がありますをレンダリングする必要があり、私のHomeコンポーネントで特定のパス

<NativeRouter history={nativeHistory}> 
    <Route exact path="/" component={Home} /> 
    <Route path="/about" component={About} /> 
    <Footer /> 
</NativeRouter> 

上のコンポーネントを非表示にするReact Router Nativeを使用していますレンダリングする。 Footerはステートレスコンポーネントです。

私は空のオブジェクトは、特定のコンポーネントをレンダリングない1つだけのパスをブラックリストする方法{}

私の質問はpropsので、私のFooterコンポーネントでprops.locationが、そのundefinedにアクセスしようとしましたか？

Answer 1

Footerには、withRouterを入力してprops.locationにアクセスできます。 戻り値をwithRouterで囲むだけで、Routeコンポーネントとして使用する他のコンポーネントと同じ小道具が得られます。

たとえば、あなたのFooter.jsは次のようにする必要があります：私はそれを試してみましたが、私はどのように1以外のすべての画面でフッターコンポーネントを使用することを知っていなかったので、これに移動うん

import { withRouter } from 'react-router-dom'; 

class Footer extends React.Component { 
    render() { 
    ... 
    // here you can access this.props.location and this.props.match 
    } 
} 

export default withRouter(Footer); 

Answer 2

フッターコンポーネントでは、現在のパスを確認し、それに応じてコンポーネントをレンダリングすることができます。私はReact Router Nativeを使用しなかったので、どうやってそれをやることができるのか分かりません。

より新しい、まだ維持されている他のナビゲーションコンポーネントを使用することをお勧めします。 React-Navigationは私が推薦できるものの1つです。