Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] não consigo renderizar os cards do coladorador

import DropdownList from '../DropdownList/DropdownList';
import TextField from '../TextField/TextField';
import './GuestCard.css'
import Botao from '../Botao/Botao';
import { useState } from 'react';

const GuestCard = (props) => {

    const [nome, setNome] =  useState('')
    const [cargo, setCargo] =  useState('')
    const [image, setImage] =  useState('')
    const [time, setTime] =  useState('')
    const aoSalvar = (evento) => {
        evento.preventDefault()
        props.aoColaboradorCadastrado({
            nome,
            cargo,
            image,
            time
        });
        setNome('')
        setCargo('')
        setImage('')
        setTime('')
    };
  return (
        <section className='guest-card'>
            <form onSubmit={aoSalvar}>
                <h2>Preencha os dados para criar o card do colaborador.</h2>
                <TextField
                    obrigatorio={true}
                    label='Nome'
                    placeholder='Digite seu nome'
                    valor={nome}
                    aoAlterado={(valor) => setNome(valor)}
                />
                <TextField
                    obrigatorio={true}
                    label='Cargo'
                    placeholder='Digite seu cargo'
                    valor={cargo}
                    aoAlterado={(valor) => setCargo(valor)}
                />
                <TextField
                    label='Imagem'
                    placeholder='Informe o endereço da imagem'
                    valor={image}
                    aoAlterado={(valor) => setImage(valor)}
                />
                <DropdownList 
                obrigatorio={true} 
                label='Time' 
                itens={props.times} 
                valor={time} 
                aoAlterado={valor => setTime(valor)}
                />
                <Botao>Criar Card</Botao>
            </form>
        </section>
    );
}
export default GuestCard;

aparece no console os novos colaboradores mas não aparece na tela

1 resposta
solução!

Olá, Graciliana! Tudo bem?

Pelo código que você compartilhou, não é possível identificar o problema com precisão. No entanto, uma possível causa para o comportamento que você descreve é que os novos colaboradores não estão sendo adicionados à lista que é renderizada na tela.

Verifique se você está passando corretamente a lista de colaboradores para o componente que renderiza os cards. Além disso, confira se você está atualizando a lista de colaboradores após cada novo cadastro.

Caso o problema persista, tente adicionar alguns logs no código para identificar em qual ponto a lista de colaboradores está sendo atualizada e se o componente que renderiza os cards está recebendo a lista atualizada.

Espero ter ajudado e bons estudos!