Após a implementação do filter para separar os Colaboradores cadastrados por Time, os cards não estão sendo renderizados e nenhum erro no console é exibido. Por favor, poderiam me ajudar? Segue abaixo repositório do código.
Após a implementação do filter para separar os Colaboradores cadastrados por Time, os cards não estão sendo renderizados e nenhum erro no console é exibido. Por favor, poderiam me ajudar? Segue abaixo repositório do código.
Consegui resolver! Caso alguém tenha o mesmo problema, se eu tentava cadastrar o colaborador sem alterar a opção de time (sendo a primeira Programação), o componente continuava com o valor inicial do estado do time que é "", tendo em vista que como não mexi no valor, ele não entrou na função aoAlterado, que altera o valor do estado inicial . Resolvi deixando "Programação" como valor padrão do estado do time. Não sei se é a melhor solução, mas funcionou. Se alguém souber de uma solução melhor, por favor me avise :)
import CampoTexto from "../CampoTexto/CampoTexto"
import "./Formulario.css"
import ListaSuspensa from "../ListaSuspensa/ListaSuspensa";
import Botao from "../Botao/Botao";
import {useState} from "react";
const Formulario = (props) => {
const [nome, setNome] = useState('')
const [cargo, setCargo] = useState('')
const [imagem, setImagem] = useState('')
const [time, setTime] = useState('Programação')
const aoSalvar = (evento) => {
evento.preventDefault()
props.aoColaboradorCadastrado(
{
nome: nome,
cargo: cargo,
imagem: imagem,
time: time
}
)
}
return (
<section className="formulario">
<form onSubmit={aoSalvar}>
<h2>Preencha os dados para criar o card do colaborador</h2>
<CampoTexto
obrigatorio={true}
label="Nome"
placeholder="Digite o seu nome"
valor={nome}
aoAlterado={valor => setNome(valor)}
/>
<CampoTexto
obrigatorio={true}
label="Cargo"
placeholder="Digite o seu cargo"
valor={cargo}
aoAlterado={valor => setCargo(valor)}
/>
<CampoTexto
label="Imagem"
placeholder="Digite o endereço da imagem"
valor={imagem}
aoAlterado={valor => setImagem(valor)}
/>
<ListaSuspensa
obrigatorio={true}
label="Time"
items={props.times}
valor={time}
aoAlterado={valor => setTime(valor)}
/>
<Botao>Criar Card</Botao>
</form>
</section>
)
}
export default Formulario