React, как очистить данный state?

Question

[DeniSidorenko]

Добрый день, есть такой state

const [form, setForm] = useState({
    name: "", price: "", rating: "", weight: ""
  })

На input есть такое события

const onChangeHandler = event => {
    setForm({...form, [event.target.name] : event.target.value})
  }

Вопрос, после удачной отправки формы, как сделать что бы state для полей был ""
Если проще, как сделать что бы после отправки очищались поля

Comments

[Gary_Ihar]

Оберни инпут в тег form, повесь на него событие onSubmit и после отправки данных почисти свой стейт

Answer 1

[twolbe]

Самым простым решением будет будет описать onSubmitHandler, в котором вы будете подавать в state начальное (пустое) состояние, которое лучше вынести в отдельную константу (понимаю, что вы и без меня в курсе). Дёргать этот onSubmitHandler нужно будет с помощью атрибута onSubmit вашей формы:

export default function FuncName(){
  const [form, setForm] = useState({
    name: "", price: "", rating: "", weight: ""
  })

  onSubmitHandler() {
    setForm({
     name: "", price: "", rating: "", weight: ""
   })
  }

  render() {
    return (
      <form onSubmit={onSubmitHandler}>
        <...>
      </form>
    );
  }
}
}