控制台抛出未终止的 JSX 内容错误

Question

我正在尝试使用 jspm/systemjs 和 babel 设置一个基本的反应示例。我这里有这段代码来显示一个简单的页面，但出现错误

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'))

没有显示任何内容，控制台正在抛出 "Unterminated JSX contents"，而 babel 指向 react.render 行：

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

Answer 1

您的 render() 中有 2 个未闭合的 <div> 标签和一个可能不属于的分号。我会摆脱那些（例如关闭它们，删除 <div>; 中的分号，如果它不属于）然后再试一次。

Answer 2

在关闭 div 元素时给出 / 并在 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'))

控制台抛出未终止的 JSX 内容错误

Console is throwing Unterminated JSX contents error

javascript

reactjs

babeljs