HiveBrain v1.2.0
Get Started
← Back to all entries
snippetjavascriptreactCritical

How to pass in a react component into another react component to transclude the first component's content?

Submitted by: @import:stackoverflow-api··
0
Viewed 0 times
firstthecontentanothertranscludereactintopasshowcomponent

Problem

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. http://codepen.io/aallbrig/pen/bEhjo

HTML


    Hi!


ReactJS

/**@jsx React.DOM*/

var BasicTransclusion = React.createClass({
  render: function() {
    // Below 'Added title' should be the child content of Hi!
    return (
      
         Added title 
        {this.props.children}
      
    )
  }
});

React.renderComponent(BasicTransclusion(), document.getElementById('my-component'));

Solution

You can use this.props.children to render whatever children the component contains:

const Wrap = ({ children }) => {children}

export default () => Hello word

Context

Stack Overflow Q#25797048, score: 259

Revisions (0)

No revisions yet.