Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

retorno de {linhas}

O método map não deve retornar uma nova lista? No exercício esta retornando um elemento Html. porque isso acontece?

const TableBody = props => {
    const linhas = props.autores.map((linha, index) =>{
        return(
            <tr>
                <td>{linha.nome}</td>
                <td>{linha.livro}</td>
                <td>{linha.preco}</td>
                <td><button>Remover</button></td>
            </tr>
        );
    });
    return(
        <tbody>
            {linhas}
        </tbody>
    );
}
4 respostas

Boa Tarde, Felipe. Tudo bem?

Realmente o map tem como objetivo retornar / modificar uma nova lista. Porém ele também é amplamente utilizado para renderizar elementos em arrays dentro do render, seja para tabelas ou itens de listas.

No fundo, ele também está modificando uma lista, mas dentro do render.

Neste tópico tem exemplos com listas e options:

https://stackoverflow.com/questions/38282997/rendering-an-array-map-in-react

https://stackoverflow.com/questions/41374572/how-to-render-an-array-of-objects-in-react

Boa tarde, Felipe! Como vai?

Sim, o map() deve ao final retornar um novo array. E aparentemente o seu código está correto.

No console do navegador ocorre algum erro? Se sim, vc poderia colar o log aqui? Assim ficará mais fácil de entender o que está rolando por baixo dos panos.

Qualquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

Então é a função render que esta esta convertendo o array gerado pelo map em elemento html?

solução!

Na minha visão é o próprio map, que está retornando para cada item um JSX com os elementos necessários.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software