时间戳

首页 > 解决方案 > 如何在 div class='App' 反应之前添加多个静态 html 元素？

html - 如何在 div class='App' 反应之前添加多个静态 html 元素？

问题描述

出于特殊的样式原因，我需要在我的 reactjs 网页之前添加 3 个空 div，但如果这样做会出现错误：

解析错误：相邻的 JSX 元素必须包含在封闭标记中。你想要一个 JSX 片段 <>...</> 吗？

我需要的是

<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div class='App'> 
...
</div>

标签： htmlcssreactjs

解决方案

您收到此错误是因为您尝试返回多个 JSX 元素，这不是 React 的工作方式

您正在尝试这样做：

<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div class='App'> 
...
</div>

但是 react 会期望您返回包含所有元素的单个 div，因此您几乎需要做的就是将它们全部包装在一个 div 中，如下所示：

<div>
    <div id="one"></div>
    <div id="two"></div>
    <div id="three"></div>
    <div class='App'> 
    ...
    </div>
</div>

推荐阅读