Basic
Password
Membuat password input.
Password memakai z.string() dengan type: "password" pada fieldConfig untuk menyamarkan karakter input. Nilai type yang di kembalikan berupa string.
Penggunaan
Simpan form.tsx dan schema.ts di folder yang sama.
"use client";
import { useForm } from "@tanstack/react-form";
import { ErlForm } from "erlangform";
import { schema, type FormValues } from "./schema";
export default function PasswordForm() {
const form = useForm({
defaultValues: { password: "" },
validators: { onChange: schema },
onSubmit: () => console.log("Password berhasil divalidasi."),
});
return (
<form
onSubmit={(event) => {
event.preventDefault();
void form.handleSubmit();
}}
>
<ErlForm<FormValues>
form={form}
schema={schema}
fieldConfig={{
password: {
label: "Password",
type: "password",
placeholder: "Masukkan password",
},
}}
/>
<button type="submit">Simpan</button>
</form>
);
}type: "password" mengatur tampilan input. Aturan seperti panjang minimum ditambahkan pada schema jika diperlukan.