javascript - 使用 react-router v4 将 props 传递给子组件

Question

以前在 react-router v3.* 我通过 props 传递给子组件

React.cloneElement(this.props.children, this.props)

这是如何在 react-router v4 中使用新<Match />API完成的

到目前为止，我想出的解决方案是使用APIrender中的方法：<Match />

<Match pattern="/" render={() => <ChildComponent {...this.props} />} />

使用 ES6 扩展语法将 props 传递给子组件。有没有更好的方法可以将所有标准道具（位置、模式、路径名、isExact）带到子组件？

Answer 1

从v4.0.0-alpha5 的渲染代码来看，有以下两种选择：

<Match pattern="/" render={props => <ChildComponent {...props} {...this.props} />} />
<Match pattern="/">{({matched, ...props}) => {
    return matched ? <ChildComponent {...props} {...this.props} /> : null;
}}</Match>

另请参阅匹配 API 文档。