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

Refatoração quebrou a aplicação

`

`Depois da refatoração o código quebrou a aplicação, tentei identificar o erro porém sem sucesso, se alguém poder ajudar.

import React, { useState } from "react"; import { ITarefa } from "../../types/tarefa"; import Botao from "../Botao"; import style from './Formulario.module.scss'; import { v4 as uuidv4 } from 'uuid';

interface Props { setTarefas: React.Dispatch<React.SetStateAction<ITarefa[]>> }

function Formulario({ setTarefas }: Props) { const [tarefa, setTarefa] = useState(""); const [tempo, setTempo] = useState("00:00"); function adicionarTarefa(evento: React.FormEvent) { evento.preventDefault(); setTarefas(tarefasAntigas => [ ...tarefasAntigas, { tarefa, tempo, selecionado: false, completado: false, id: uuidv4() } ] ); setTarefa(""); setTempo("00:00"); } return (

Adicione um novo estudo <input type="text" name="tarefa" id="tarefa" value={tarefa} onChange={evento => setTarefa(evento.target.value)} placeholder="O que você quer estudar" required />
Tempo <input type="time" step="1" name="tempo" value={tempo} onChange={evento => setTempo(evento.target.value)} id="tempo" min="00:00:00" max="01:30:00" />
Adicionar ) }

export default Formulario;

CONSOLE..

TS2322: Type '{ setTarefa: Dispatch<SetStateAction<ITarefa[]>>; }' is not assignable to type 'IntrinsicAttributes & Props'.

Property 'setTarefa' does not exist on type 'IntrinsicAttributes & Props'. Did you mean 'setTarefas'? 38 | return ( 39 |

40 | | ^^^^^^^^^ 41 | <Lista 42 | tarefas={tarefas} 43 | selecionaTarefa={selecionaTarefa} />

2 respostas
solução!

Olá Willian Souza,

Espero que esteja tudo bem contigo.

Está um pouco difícil de entender o código na forma como publicou, tenta colocar entre crase o código para ficar desse jeito: import React from 'react' ou envia um print da tela que talvez fique melhor de ver o problema ou compartilha o teu repositório do Github com o código, mas vamos ver, que parece que na declaração da função adicionarTarefa:

function adicionarTarefa(evento: React.FormEvent)

faltou colocar a tipagem<HTMLFormElement>, ficando dessa forma:

function adicionarTarefa(evento:React.FormEvent<HTMLFormElement>)

E vale a pena dar uma olhada na interface ITarefa para ver se a tarefa está declarada lá:

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Sugestão, dá uma verificada em como ficou no repositório do professor no github e identifica no teu o que está diferente: https://github.com/alura-cursos/alura-studies/blob/main/src/components/Formulario/index.tsx

Espero ter ajudado, sucesso!

Olá Carlos Eduardo, tudo bem? Consegui encontrar o problemas, esta na classe App() lá dentro tem o setTarefa como no erro, porém é "setTarefas" no plural e estava no singular. Obrigado pela atenção.