ErlangFormDocs v1.0.0
Data terstruktur

Union dan discriminated union

Form bercabang berdasarkan discriminator dan batasan union biasa.

Penggunaan

Gunakan form dari useForm. Lihat persiapan awal.

example.tsx
const schema = z.object({
  contact: z.discriminatedUnion("kind", [
    z.object({ kind: z.literal("person"), name: z.string() }),
    z.object({ kind: z.literal("company"), company: z.string() }),
  ]),
});

<ErlForm
  form={form}
  schema={schema}
  fieldConfig={{
    contact: {
      name: { label: "Nama personal" },
      company: { label: "Nama perusahaan" },
    },
  }}
/>

Discriminated union

Pasang mengikuti Quick Start. Pilihan discriminator diinferensikan dari seluruh cabang. Semua field cabang dapat dikonfigurasi; callback menerima object union sehingga dapat melakukan narrowing berdasarkan kind.

Renderer memilih cabang sesuai nilai discriminator; bila tidak cocok, ia menampilkan cabang pertama. Tampilan fallback tidak berarti datanya valid. Gunakan discriminator string literal dan nilai awal yang valid.

Pergantian cabang tidak otomatis mengisi seluruh nilai awal cabang baru atau menghapus nilai cabang lama. Normalisasikan state dalam aplikasi bila diperlukan, dan validasi sebelum menyimpan.

Union biasa

Union dengan tipe hasil inferensi sama memakai renderer tipe tersebut; pilihan string literal digabungkan. Union tipe campuran seperti z.union([z.string(), z.number()]) menjadi unknown dan tidak mempunyai input bawaan. Gunakan registry unknown atau rancang discriminated union.

Intersection object menggabungkan metadata child kiri dan kanan; tidak melakukan deduplikasi nama field. Hindari child duplikat atau gabungkan object schema secara eksplisit.

Di halaman ini