javascript - 如何包装 React Router v4 的 NavLink 组件？

Question

我试图弄清楚如何包装 React Router v4 的NavLink组件以设置默认值activeClassName。

但是，props未定义。

包装：

const Test = ({children, props}) => {
  console.log(children) // Blackboard
  console.log(props) // undefined
  return (
    <NavLink activeClassName="active" {...props}>
      {children}
    </NavLink>
  )
}

利用：

<Test to='/blackboard'>Blackboard</Test>

为什么已children填充但props 未定义？

更新：

当使用to代替时props，它可以工作。

const Test = ({children, to}) => {

但是，我不确定为什么props不起作用。

Answer 1

好的，我现在明白了。

const Test = ({children, to}) => {

children并to从 解构props。

这有效：

const Test = props => 
  <NavLink activeClassName='active' {...props}>
    {props.children}
  </NavLink>