javascript - 如何将反应组件传递到另一个反应组件以转换第一个组件的内容？(How to pass in a react component into another react component to transclude the first component's content?)

Question

Is there a way to pass one component into another react component?(有没有办法将一个组件传递到另一个反应组件？)

I want to create a model react component and pass in another react component in order to transclude that content.(我想创建一个模型反应组件并传入另一个反应组件以转换该内容。) Edit: Here is a reactJS codepen illustrating what I'm trying to do.(编辑：这是一个reactJS codepen，说明我正在尝试做什么。) http://codepen.io/aallbrig/pen/bEhjo(http://codepen.io/aallbrig/pen/bEhjo) HTML(HTML) <div id="my-component"> <p>Hi!</p> </div> ReactJS(ReactJS) /**@jsx React.DOM*/ var BasicTransclusion = React.createClass({ render: function() { // Below 'Added title' should be the child content of <p>Hi!</p> return ( <div> <p> Added title </p> {this.props.children} </div> ) } }); React.renderComponent(BasicTransclusion(), document.getElementById('my-component'));   ask by Andrew Allbright translate from so

Answer 1

You can use this.props.children to render whatever children the component contains:(您可以使用this.props.children来呈现组件包含的this.props.children ：)

const Wrap = props => <div>{props.children}</div> export default () => <Wrap><h1>Hello word</h1></Wrap>