how to get params using react router dom v5.0.1

Viewed 3851

how to get params using react router dom v5.0.1 before I could get parameters, but now I can't get them, what's the problem?

<BrowserRouter>
      <Route path='/' exact component={Login} />
      <Route path='/register' component={Register} />
      <Route path='/home' component={Home} />
      <Route path='/all/merchant' component={AllMerchant} />
      <Route path='/detail/merchant/:id_merchant' exact component={DetailMerchant} />
      <Route path='/detail/merchant/promo/:id_merchant' component={MerchantByPromo} />
      <Route path='/promo/voucher/by/merchant/' component={MerchantByPromoDetail} />
      <Route path='/all/category' component={Category} />
      <Route path='/category/id/:category_id' component={CategoryById} render = {props => <CategoryById {...props} key={this.props.match.params} /> }/>
      <Route path='/promo/grid/view' component={PromoGridView} />
      {/* params not found */}
      <Route path='/promo/grid/view/by/category/:category_id' component={AllPromoGridView} />
      <Route path='/detail/promo/:voucher_id/category_id/:category_id' component={PromoGridViewDetail} />
      {/* params not found */}
      <Route path='/account' component={Account} />
    </BrowserRouter>
1 Answers

According to the react-router doc, it should be accessible in your Component via the props match:

Example:

// the route
<Route path="/:id" component={Child} />

/*
...
*/ 

//the component
function Child({ match }) {
  return (
    <div>
      <h3>ID: {match.params.id}</h3>
    </div>
  );
}
Related