Como podemos gerar uma matriz de dados como elementos J ou X?
Bem, na verdade é relativamente trivial.
Vamos mapear essa matriz de tarefas, objetos para uma matriz de J. S. X elementos porque o REACT é capaz de
gerar uma matriz de elementos JavaScript.
Para isso, deixe-me mostrar como isso funciona.
Vamos usar esses chavetas simples, porque quero adicionar uma expressão JavaScript aqui.
Na minha expressão, aqui está uma matriz simples, mas uma matriz de itens da lista.
Oi.
E depois outro.
Isso funciona, eu produzo isso no meu código J é X com chaves simples, porque este ano é claro que não é J é X,
é uma matriz, mas é uma matriz cheia de J é X.
E se eu tiver segurança, ela sai alta e isso funciona.
Temos um erro ou um aviso que você pode ignorar por enquanto.
Mas isso funciona em geral.
Agora, como isso funciona com dados codificados, também podemos gerar nossa matriz de objetivos para gerar
objetivos aqui.
Mas o problema é que o objetivo de props é, no final, uma matriz de objetos JavaScript, não uma matriz de J.
Código ASICs.
Então, se tentarmos produzir este ano.
Isso irá falhar.
Diz a você que os objetos não são válidos como reagir filho.
Considerando que temos filhos.
Portanto, no final, não podemos gerar objetos JavaScript simples baunilhados em J é X.
Em vez disso, precisamos mapear todos os objetos em um J como equivalente a X.
Então, em um elemento renovável.
Então, aqui, queremos mapear todos os objetos em um item da lista no final.
Assim, adereços objetivos, que é uma matriz.
Podemos chamar o método map.
Esse é um método JavaScript padrão que existe em qualquer matriz.
O método do mapa assume uma função.
Aqui, eu passo uma função de seta que é executada em todos os elementos da matriz.
Você chama o mapa e então a disfunção retornará.
Transforme as palavras desse elemento na matriz original e o mapa geral retornará uma nova matriz
cheia dessas partes de dados transformadas.
Portanto, esta função receberá o elemento existente aqui.
Portanto, todos os objetivos de nossos objetivos são organizados e, em seguida, retornam um novo elemento.
Portanto, nesta nova matriz, retorne pelo mapa, quero ter um monte de J com X elementos.
Então, aqui, retornarei apenas um item da lista.
Qual é ela é ex, é claro.
E o item da lista, eu quero exibir meu texto dourado, não há objetivo aqui, o objeto JavaScript que temos em sua
matriz original, porque essa função é executada em todos os elementos da matriz original e fornece
o objeto na taxa original ou nos dados peça na matriz original como argumento.
Então, o objetivo aqui é esse objeto, que parece este ano.
Então, eu estou interessado apenas no texto aqui.
E, novamente, podemos produzir o texto produzindo uma expressão JavaScript aqui.
Portanto, precisamos usar chaves em nosso código J é X aqui e temos o texto do ponto da meta aqui.
Minha expressão é que eu acesso à propriedade text no objeto gold.
Então agora o que acontece aqui é que mapeio minha matriz de objetos JavaScript simples para uma matriz de elementos J is X, e
uma matriz de G. S. Elementos X é renderizar fatura, como você aprendeu.
Agora, enfrente a segurança.
Veja bem, isso supera minhas habilidades principais novamente.
Agora também recebemos um aviso sobre uma chave exclusiva que está relacionada a como a reação renderiza o DOM e que ela
deseja fazer isso de forma eficiente.
Você aprende mais sobre isso no meu React, o curso completo do guia.
E, portanto, sempre que você produzir listas de dados com essa técnica, você precisará adicionar um suporte especial
a cada item que estiver renderizando na lista.
Nesse caso, para cada item da lista.
E esse é o suporte principal que é um suporte que o próprio reagir entende.
E aqui eu quero gerar o objetivo I. D. novamente.
Embrulhado em chaves.
Porque esta é uma expressão JavaScript regular.
Portanto, agora com o pai, não recebemos o aviso e temos as metas do curso.
Então é assim que produzimos uma lista de dados.
Com isso, isso parece muito bom.
Estamos exibindo nossa lista de dados.
Por que não trabalhamos agora para adicionar algumas funcionalidades que nos permitem adicionar nossos próprios objetivos?
Esse seria um bom próximo passo.