Junior
O que é usado para exibir uma lista de dados em JSX?
sobes.tech IA
Resposta da IA
Para exibir uma lista de dados em JSX, utiliza-se o método .map() dos arrays do JavaScript.
// Exemplo de array de dados
const items = ['Item 1', 'Item 2', 'Item 3'];
// Exibir lista usando .map()
const List = () => (
<ul>
{items.map((item, index) => (
// É obrigatório usar uma chave única para cada elemento da lista
<li key={index}>{item}</li>
))}
</ul>
);
map() percorre cada elemento do array e retorna um novo array de elementos React, que são então renderizados no DOM. É importante usar uma propriedade key única para cada elemento na lista. Isso ajuda o React a atualizar a interface de forma eficiente ao alterar a lista. Como key, pode-se usar um identificador único dos dados, ou, na sua ausência, o índice do elemento no array.