React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

by Cody Lindley

HTML

<script src="https://fb.me/react-with-addons-0.14.0.js"></script>
<script src="https://fb.me/react-dom-0.14.0.js"></script>
<div id="app"></div>

Babel + JSX

var Parent2 = React.createClass({
  componentDidMount: function() {
	//access to <span>child2text</span>, if only one child no array used
	console.log(this.props.children);
	//would log child2text, because I am grabbing the child of the <span>
	console.log(this.props.children.props.children);
  },

  render: function() {return <div />;}
});

var Parent = React.createClass({
  componentDidMount: function() {
	//access to array, containing <div>test</div><div>test</div>
	console.log(this.props.children);
	//would log childtext, because I am grabbing the child of the first <div> in the array
	console.log(this.props.children[1].props.children);
  },

  render: function() {return <Parent2><span>child2text</span></Parent2>;}
});

ReactDOM.render(
  <Parent><div>child</div><div>childtext</div></Parent>,
  document.getElementById('app')
);