reactjs - react-router 将先前的路由道具传递给子路由

Question

有没有办法使用 react-router 将 props 从 Parent 组件传递到 Child 组件？

<Route path="/parent/" component={Parent} />
<Route path="/parent/child/" component={Child} />

注意 Child 没有在 Parent 的渲染函数中渲染。

谢谢

标签： reactjsreact-router

Answer 1

我认为这里一个好的解决方案是带有渲染道具的嵌套路由。

// Parent.jsx

render() {
  const { match: { url }, xyz } = this.props;
  return (
    <Route path={`${url}/child`} render={() => <Child xyz={xyz} />}
  );
}