javascript - reactdom - react project with jsx

Reaccionar, contenidos de JSX no terminados.

Question

Estoy tratando de configurar un ejemplo de reacción básica: usar jspm / systemjs y babel. Tengo este código aquí para mostrar una página simple y recibo un error

import React from ''react'';

export default React.createClass({
displayName: ''MainComponent'',
propTypes: {
    item: React.PropTypes.object
},
render: function render() {
    return (
        <div class="builder-conteiner">

        <div>;
    );
}
});

React.render(<MainComponent />, document.getElementById(''app''))

No se muestra nada, y la consola emite "Contenidos JSX sin terminar", y babel apunta a la línea react.render así:

 17 | React.render(<MainComponent />, document.getElementById(''app''))
    |                               ^ 

Aún así, no estoy seguro de qué está mal aquí, agradecería cualquier ayuda. ¡Gracias!

Answer 1

Dé / cierre el elemento div y elimine el punto y coma (;) después del elemento div.

import React from ''react'';

export default React.createClass({
displayName: ''MainComponent'',
propTypes: {
    item: React.PropTypes.object
},
render: function render() {
    return (
        <div class="builder-conteiner">

        <div/>
    );
}
});

React.render(<MainComponent />, document.getElementById(''app''))

Answer 2

Tiene 2 etiquetas <div> cerrar en su render() y un punto y coma que probablemente no pertenezca. Me gustaría deshacerme de ellos (p. Ej., Cerrarlos, eliminar el punto y coma en <div>; si no pertenece) y volver a intentarlo.