[英]React extract param from url
I'm using react-router
for routing . 我正在使用
react-router
进行路由。 I've used NavLink
and Route
components like this: 我已经使用了
NavLink
和Route
组件,如下所示:
<NavLink className={classes.navLink}
activeClassName={classes.activeNavLink}
to={`/brokers/${n.id}`}\>
....
<Route exact path="/brokers/:id" component={BrokerDetails} />
Now my question is - how do I use the id
parameters passed in inside the BrokerDetails
component ? 现在我的问题是-如何使用
BrokerDetails
组件内部传递的id
参数? I tried reading it via the props but it doesn't exist . 我尝试通过道具阅读它,但是它不存在。
When using component=
..., your component will be passed the route props . 当使用
component=
...时,您的组件将被传递给props路线 。
In particular, you'll want to access the match
object: 特别是,您将要访问
match
对象:
const BrokerDetails = ({match}) => <div>{JSON.stringify(match.params)}</div>;
should show you all the parameters; 应该向您显示所有参数;
match.params.id
would be the id
parameter. match.params.id
将是id
参数。
If you try to access props.Id
won't work because it isn't in that location. 如果您尝试访问
props.Id
则因为它不在该位置而无法使用。
When you try to access params from an URL, which is passed using 'React-router-dom', then the way to access the props is match.params.id
当您尝试通过使用'React-router-dom'传递的URL访问参数时,访问道具的方法是
match.params.id
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.