Medan Tarikh

Membolehkan pengguna memasukkan tarikh dalam format berstruktur menggunakan medan berasingan untuk hari, bulan, dan tahun.

Source Storybook

Penggunaan

Import

import { DateField } from "@govtechmy/myds-react/date-field";

Anatomi

export default () => <DateField />;

Contoh

Saiz

Gunakan prop size untuk menukar saiz medan tarikh!

Keadaan Tidak Terkawal vs Terkawal

Untuk menggunakan medan tarikh dalam keadaan tidak terkawal, tetapkan prop defaultValue kepada nilai awal medan tarikh.

Untuk menggunakan medan tarikh dalam keadaan terkawal, tetapkan prop value kepada nilai semasa medan tarikh dan sediakan pendengar acara onValueChange untuk mengendalikan perubahan.

Tidak Terkawal

Terkawal

Dilumpuhkan

Medan tarikh boleh dilumpuhkan dengan menetapkan prop disabled kepada true. Apabila dilumpuhkan, medan tarikh tidak akan interaktif.

Tidak Sah

Keadaan tidak sah dicetuskan apabila medan tarikh gagal pengesahan. Untuk menunjukkan medan tarikh tidak sah, tetapkan prop invalid kepada true.

Props

DateField

Prop	Type	Default
`size`	`enum`	`small`
`defaultValue`	`string`	-
`value`	`string`	-
`onChange`	`(date: string ) => void`	-
`disabled`	`boolean`	`false`
`invalid`	`boolean`	`false`

MYDS