通过react-router v4将props传递给子组件

Passing props to children components with react-router v4

本文关键字：组件 props react-router v4 通过      更新时间：2023-09-26

前情回顾。*我通过

将props传递给子组件
React.cloneElement(this.props.children, this.props)

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

到目前为止，我想出的解决方案是在<Match /> API中使用render方法:

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

使用ES6的扩展语法将props传递给子组件。是否有一个更好的方式，也携带它所有的标准道具(位置，模式，路径名，isExact)到子组件?

根据v4.0.0-alpha5的呈现代码判断，您有以下两个选项:

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