Cara Hapus Semua Nilai Input Setelah Submit Form di React

Dibuat
·
Dilihat19 kali
0

Saya lagi bikin formulir di React, saya ingin agar ketika formulir dikirim semua nilai input yang ada di dalam elemen form menjadi kosong kembali (dihapus), bagaimana caranya ya?

Contoh formulir yang saya gunakan:

function Home() {
  const onSubmit = (e: React.FormEvent<HTMLFormElement>) => {
    e.preventDefault();
  };

  return (
    <form onSubmit={onSubmit}>
      <input type="text" name="name" />
      <input type="email" name="email" />
      <button type="submit">Kirim</button>
    </form>
  );
}
1 Jawaban
0

Tinggal tambahkan e.target.reset() di dalam fungsi onSubmit ini akan me-reset semua input yang ada di dalam formulir.

Seperti ini:

function Home() {
  const onSubmit = (e: React.FormEvent<HTMLFormElement>) => {
    e.preventDefault();
    (e.target as HTMLFormElement).reset(); // reset input
  };

  return (
    <form onSubmit={onSubmit}>
      <input type="text" name="name" />
      <input type="email" name="email" />
      <button type="submit">Kirim</button>
    </form>
  );
}
Dibuat

Kamu tau jawabannya?

Ayo bergabung bersama lebih dari 200.000 pengguna lainnya!