[英]Way for child to inherit all properties from parent
我有三个组成部分,我想称之为Search
。
<SearchContainer>
{this.props.withFilter ? <SearchFilter>Filter Orders </SearchFilter> : null}
<SearchBox withFilter={this.props.withFilter}'/>
</SearchContainer>
但是, SearchBox
组件本身需要一些道具。
{
action: React.PropTypes.string,
name: React.PropTypes.string,
method: React.PropTypes.string,
placeholder: React.PropTypes.string,
withFilter: React.PropTypes.boolean
}
我希望能够调用Search
组件并能够将一大堆道具传递给SearchBox
而不必将每个属性添加到Search
。 有没有办法让孩子继承父母的道具?
理想情况下,我可以将道具传递给Search
并且SearchBox
可以访问它们,而无需我明确地编写每个属性。
<Search placeholder='Hi'>
正如卡尔格罗纳在上面的评论中所说, spread attributes
起到了作用。
var React = require('react')
var SearchContainer = require('../shopify-react-ui/SearchContainer')
var SearchFilter = require('../shopify-react-ui/SearchFilter')
var SearchBox = require('../shopify-react-ui/SearchBox')
module.exports = React.createClass({
displayName: 'Search',
propTypes: {
withFilter: React.PropTypes.boolean
},
render: function () {
return (
<div>
<SearchContainer>
{this.props.withFilter ? <SearchFilter>Filter Orders </SearchFilter> : null}
<SearchBox {...this.props}/>
</SearchContainer>
</div>
)
}
})
然后你可以像这样使用这个组件:
<Search placeholder='Hi Mom!'/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.