Как я могу добавить несколько статических элементов HTML перед div class = 'App' в реакции?

Question

Мне нужно добавить 3 пустых div перед моей веб-страницей reactjs по особым причинам стиля, но если я это сделаю, я получаю сообщение об ошибке:

Ошибка синтаксического анализа: смежные элементы JSX должны быть заключены во включающий тег. Вам нужен фрагмент JSX <> ... ?

Мне нужно

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

html css reactjs

1

Pinco Pallino 19 Авг 2020 в 12:55

Answer 1

Ваше сообщение об ошибке содержит необходимые сведения:

Ошибка синтаксического анализа: смежные элементы JSX должны быть заключены во включающий тег. Вам нужен фрагмент JSX <> ... ?

Это означает, что вам нужно обернуть свои элементы в фрагмент JSX, например:

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

Обратите внимание, что <>...</> - это просто сокращение для <React.Fragment>...</React.Fragment>.

2

Lionel Rowe 19 Авг 2020 в 10:04

Answer 2

Вы получаете эту ошибку, потому что пытаетесь вернуть несколько элементов 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>

2

Drizz159 19 Авг 2020 в 10:02

Как я могу добавить несколько статических элементов HTML перед div class = 'App' в реакции?

2 ответа

Похожие вопросы

Новые вопросы

html