首页 文章

Wepack错误：相邻的JSX元素必须包装在一个封闭的标签中[重复]

提问于
浏览 次
1

这个问题在这里已有答案：

创建一个新组件并在我的主组件中使用它并运行webpack后，我得到了错误

相邻的JSX元素必须包含在封闭标记中

这是我的代码片段：

var React = require('react');
var Nav = require('Nav');

var Main = React.createClass({
  render : function(){
    return (
      <Nav />
      <h2>Main Component</h2>
    );
  }
});
javascript reactjs webpack ecmascript-6

3 回答

  • 3

    当有多个元素时，你需要将它包装起来，这样它才会返回一个：

    var Main = React.createClass({
  render: function() {
    return (
      <div>
        <Nav />
        <h2>Main Component</h2>
      </div>
    );
  }
});
    回复于
  • 2

    错误消息非常明显：您无法返回

    (
  <Nav />
  <h2>Main Component</h2>
)

    因为它们是两个组成部分 . 在返回之前将它们包裹在其他东西中 .

    回复于
  • 0

    它应该由根元素包装

    <div>
     <Nav/>
     <h2>Main Component</h2>
  </div>
    回复于

相关问题