En React JSX no parece posible hacer algo como esto:

render: function() {
  return (
    <{this.props.component.slug} className='text'>
      {this.props.component.value}
    </{this.props.component.slug}>
  );
}

Aparece un error de análisis: token inesperado {. ¿No es esto algo que React puede manejar?

Estoy diseñando este componente para que, debajo del capó, los valores almacenados enthis.props.component.slug contendrá elementos HTML válidos (h1, p, etc.). ¿Hay alguna manera de hacer funcionar esto?