Muchos lenguajes de plantilla tienen declaraciones de "ranuras" o "rendimientos", que permiten realizar algún tipo de inversión de control para envolver una plantilla dentro de otra.

Angular tieneOpción "transcluir".

Rieles tienedeclaración de rendimiento. Si React.js tuviera una declaración de rendimiento, se vería así:

var Wrapper = React.createClass({
  render: function() {
    return (
      <div className="wrapper">
        before
          <yield/>
        after
      </div>
    );
  }
});

var Main = React.createClass({
  render: function() {
    return (
      <Wrapper><h1>content</h1></Wrapper>
    );
  }
});

Salida deseada:

<div class="wrapper">
  before
    <h1>content</h1>
  after
</div>

Por desgracia, React.js no tiene un<yield/>. ¿Cómo defino el componente Wrapper para lograr el mismo resultado?