react template

HTML

<script src="http://fb.me/react-js-fiddle-integration.js"></script>
<div id="withKey"></div>
<div id="withoutFlatten"></div>
<div id="withFlatten"></div>

JavaScript 1.7

/**
* @jsx React.DOM
*/

// This should be preferred since it allows React to track elements
var TestKey = React.createClass({
  render: function() {
    return (
      <div>
        {[1,2,3].map(function (n) {
          return (
            <div key={n}>
              <h3>{'With key ' + n}</h3>
              <p>{n}</p>
            </div>
          );
        })}
      </div>
    );
  },
});

var Test = React.createClass({
  render: function() {
    return (
      <div>
        {[1,2,3].map(function (n) {
          return ([
            <h3>{'Without flatten ' + n}</h3>, // note the comma
            <p>{n}</p>
          ]);
        })}
      </div>
    );
  },
});

function pseudoFlatten() {
  return [].concat.apply([], arguments);
};

var TestFlatten = React.createClass({
  render: function() {
    return (
      <div>
        {pseudoFlatten([1,2,3].map(function (n) {
          return ([
            <h3>{'With flatten ' + n}</h3>, // note the comma
            <p>{n}</p>
          ]);
        }))}
      </div>
    );
  },
});

React.renderComponent(<TestKey/>, document.getElementById('withKey'));
React.renderComponent(<Test/>, document.getElementById('withoutFlatten'));
React.renderComponent(<TestFlatten/>, document.getElementById('withFlatten'));