React Router 不会将值传递给 match.props答案

【问题标题】：React Router don't pass value to match.propsReact Router 不会将值传递给 match.props
【发布时间】：2018-10-21 01:50:19
【问题描述】：

所以，我开始使用 Redux 和 react-router 学习 React。 .net 的大混乱

我想使用match 对象在给定的 url 中查找道具，所以我可以这样做：

function NumberHeader ({match}){
   var number = match.props.nr;
   ..... Logic down here ...
}

我定义了这样的路线：

<Route path={`/number/:nr`} component={() => <NumberHeader match={this.props.match} />} />

NumberHeader 组件在正确的 url 上呈现，但我无法获得任何道具。

所有这些逻辑都不是发生在 App 根目录中，而是发生在这个渲染的组件中：

<Route path={routes.NUMERO} component={() => <DrawsPage />} />

我需要遵循哪些关键因素，这样才能奏效？我正在使用最新的 react-router v4。谢谢。

【问题讨论】：

Passing props to component in react router 可能重复
你只需要匹配来获取“nr”url参数吗？那么，您是否还在为将“匹配”作为道具传递给组件而烦恼。这是不必要的。您可以通过 NumberHeader 组件中的match.params.nr 轻松获取。

【解决方案1】：

从组件声明中传递道具：

component={props => <NumberHeader {...props} />}

或者，只是做

component={NumberHeader}

【讨论】：