react-router參數化重定向

Question

我在弄清楚如何參數化路由字符串以編程方式重定向時遇到麻煩。

我在/constants/routes.js設置

export defaults {
  user_details: '/user/:id/details',
}

我想以編程方式推送:id參數為

import routes from '../../constants/routes.js'
const UserListItem = ({name, id, history}) => (
  <li onClick={ () => history.push(routes.user_details, {id}) }>
  {name}
  </li>
)

互聯網似乎充滿了<Redirect to={/user/${id}/details} /> ，這似乎並不是最佳選擇，因為我想重用我的不變路線

Answer 1

取決於您如何使用這些路線常數。 我也不確定“繞過任何規則”的含義，但是您可以將常量更改為函數。

export defaults {
  userDetails: (id = ":id") => `/user/${id}/details`,
}

用法：

path={routes.userDetails()} -> `/user/:id/details`

history.push(routes.userDetails("abc123")) -> `/user/abc123/details`