ReactJS井字游戏

Question

使用reactJS教程时出现解析错误。

./ src / index.js   第12行：解析错误：相邻的JSX元素必须包装在一个封闭的标记中。您是否想要JSX片段<> ...

  white-space: pre-wrap;"></div><div id="root"></div>
                                ^

这是reactjs.org上共享的代码。但这对我不起作用。

Answer 1

此错误意味着您不能在JSX中拥有类似的东西：

<div>a</div>
<div>b</div>

必须像这样包装，注意Fragment可以是任何可以接受子组件的组件，当通常不需要div但必须符合JSX语法并且需要导入时，Fragment可以包装东西来自React：

<Fragment>
  <div>a</div>
  <div>b</div>
</Fragment>

在那之后，如果您发现其他与此错误不相关的错误，则可能与它们无关。

Answer 2

将所有HTML元素都包含在div之间，将它们包裹起来

<div>
   <...>
   </...>
</div>