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

Problema ao resetar formulário

Apesar de seguir os mesmos passos do professor, o resetar formulário não está funcionando:

import React from "react";
import { ITarefa } from "../../types/tarefa";
import Botao from "../Botao";

import style from './Formulario.module.scss'

class Formulario extends React.Component<{setTarefas:React.Dispatch<React.SetStateAction<ITarefa[]>>}>{
    state = {
        tarefa: "",
        tempo: "00:00"
    }

    adicionarTarefa(evento: React.FormEvent){
        evento.preventDefault();
        this.props.setTarefas(tarefasAntigas => 
            [
                ...tarefasAntigas, 
                {
                    ...this.state
                }
            ]
        )
        this.setState({
            tarefa: "",
            tempo: "00:00"
        })
    }

    render(){
        return(
            <form className={style.novaTarefa} onSubmit={this.adicionarTarefa.bind(this)}>
                <div className={style.inputContainer}>
                    <label htmlFor="tarefa">
                        Adicione um novo estudo
                    </label>
                    <input 
                        type="text" 
                        name="tarefa"
                        onChange={evento => this.setState({...this.state, tarefa: evento.target.value})}
                        id="tarefa" 
                        placeholder="O que você quer estudar" 
                        required
                    />
                </div>

                <div className={style.inputContainer}>
                    <label htmlFor="tempo">Tempo</label>
                    <input 
                        type="time" 
                        step="1" 
                        name="tempo"
                        value={this.state.tempo}
                        onChange={evento => this.setState({...this.state, tempo: evento.target.value})}
                        id="tempo" 
                        min="00:00:00" 
                        max="01:30:00" 
                        required
                    />
                </div>

                <Botao type="submit">Adicionar</Botao>
            </form>
        )
    }
}

export default Formulario;
1 resposta
solução!

Achei o erro, eu esqueci de colocar o "value" no input :)

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