Особенности хранения нескольких тегов в константах JSX
Необходимо учитывать, что несколько тегов, хранящихся в константе, обязательно нужно обернуть в какой-то общий тег. То есть вот так код не будет работать:
function App() {
const str = <p>text1</p><p>text2</p>;
return <main>
{str}
</main>;
}
А вот так будет, так как абзацы обернуты
в один тег div:
function App() {
const str = <div><p>text1</p><p>text2</p></div>;
return <main>
{str}
</main>;
}
Можно также использовать пустые теги:
function App() {
const str = <><p>text1</p><p>text2</p></>;
return <main>
{str}
</main>;
}
Дан следующий код:
function App() {
const li1 = <li>text1</li>;
const li2 = <li>text2</li>;
const li3 = <li>text3</li>;
}
Сделайте так, чтобы результатом рендеринга было следующее:
<ul>
<li>text1</li>
<li>text2</li>
<li>text3</li>
</ul>