0
我正在通过react-router-tutorial和lesson 5,并且有一个问题。自动嵌套组件中的this.props.children
的教训谈到限定NavLink
组件包裹Link
部件,并赋予它一个activeClassName
属性,它被用作如下:
<NavLink to="/about">About</NavLink>
在课,它们定义了NavLink
组分如下:
// modules/NavLink.js
import React from 'react'
import { Link } from 'react-router'
export default React.createClass({
render() {
return <Link {...this.props} activeClassName="active"/>
}
})
让我困惑的是使用自闭合的Link
组件。没有在NavLink
的定义中说明将this.props.children
放在Link
组件的内部。我明确地试了下来,如下:
export default class extends React.Component {
render() {
return (
<Link {...this.props} activeClassName="active">{this.props.children}</Link>
)
}
}
而且这也按预期工作。我的问题是为什么?什么使自定义的Link
组件在它们的定义中自动取NavLink
的this.props.children
并将其放入Link
组件?
太棒了,谢谢!我已经看到了有关使用this.props的spread运算符的文档,但认为它只是为标签做了属性,而不是标签的内容。搞定了! – breed