how to render child components in react.js recursively

Question

I wanted to recursively add a react component from within its own component. I saw this example of a tree component which was mapping through the child TreeNodes and adding

Answer 1

The easiest way is to create a function in the class which returns an instance of your class:

RecursiveComponent.rt.js:

var RecursiveComponent = React.createClass({
 render: function() {
  // JSX
  ....
 },
 renderRecursive: function(param1)
   return React.createElement(RecursiveComponent, {param1: param1});

});

if you use react-templates library:

RecursiveComponent.rt:

  ...
  

            {this.renderRecursive(recursiveChild)}