ホーム>source

私は react-router を使用しています  ルーティング用。 NavLink を使用しました  および Route  このようなコンポーネント:

<NavLink className={classes.navLink}
          activeClassName={classes.activeNavLink}
          to={`/brokers/${n.id}`}\> 
....
<Route exact path="/brokers/:id" component={BrokerDetails} />

今私の質問は-私はどのように id を使用しますか   BrokerDetails 内で渡されるパラメーター  コンポーネント?小道具で読んでみましたが、存在しません。

あなたの答え
  • 解決した方法 # 1

    component= を使用する場合 ...、コンポーネントはルートの小道具に渡されます。

    特に、 match にアクセスする必要があります。  オブジェクト:

    const BrokerDetails = ({match}) => <div>{JSON.stringify(match.params)}</div>;
    
    

    すべてのパラメーターが表示されます。 match.params.id   id になります  パラメータ。

  • 解決した方法 # 2

    props.Id にアクセスしようとした場合  その場所にないため機能しません。

    'React-router-dom'を使用して渡されるURLからparamsにアクセスしようとすると、propsにアクセスする方法は match.params.id です

  • 前へ java - JPAクエリ:サブクエリをグループ化条件に結合する
  • 次へ javascript - プロパティをスタイル付きコンポーネントに渡す