> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# DateField 日付ピッカー

> YiDA の DateField 日付ピッカーコンポーネントの公式ドキュメント。日付フォーマット、許容値、時間制限範囲などの属性設定を解説し、ポップアップパネルから特定の日付を入力する方法を紹介します。

## 使用シーン

* 特定の日時を入力または選択する場合に使用します。ユーザーが日付を入力する際、標準入力ボックスをクリックすると日付パネルが表示され、そこから選択できます。

## コンポーネント例

## コンポーネント属性

| 属性                 | 説明                                                                                               | タイプ                                                                                | デフォルト             |
| ------------------ | ------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------- | ----------------- |
| `behavior`         | フォームコンポーネントの表示状態                                                                                 | [Behavior](/ja/open/yida/components/interface#behavior)                            | `'NORMAL'`        |
| `disabledDate`     | カスタム制限。**type** 属性が `custom` の場合に有効                                                              | `(current: number)=> boolean`                                                      | -                 |
| `end`              | 日付の終了時刻。**type** 属性が `duration` の場合に有効                                                           | `number`                                                                           | -                 |
| `format`           | 日付フォーマット                                                                                         | `'YYYY' \| 'YYYY-MM' \| 'YYYY-MM-DD'\| 'YYYY-MM-DD HH:mm'\| 'YYYY-MM-DD HH:mm:ss'` | `'YYYY-MM-DD'`    |
| `hasClear`         | クリアボタンを表示するかどうか                                                                                  | `boolean`                                                                          | `true`            |
| `label`            | フォームコンポーネントのタイトル                                                                                 | `string`                                                                           | -                 |
| `labelAlign`       | フォームコンポーネントのタイトル位置                                                                               | `'left' \| 'top'`                                                                  | `'top'`           |
| `labelColOffset`   | タイトルのオフセット位置を設定します。値はグリッド値で、1 は 1/24 を表します。                                                      | `number`                                                                           | `0`               |
| `labelColSpan`     | タイトルの幅を設定します。値はグリッド値で、1 は 1/24 を表します。                                                            | `number`                                                                           | `4`               |
| `labelTextAlign`   | フォームコンポーネントのタイトル配置                                                                               | `'left' \| 'right'`                                                                | `'right'`         |
| `labelTipsIcon`    | フォームコンポーネントのタイトルヒントのエントリアイコン。`labelTipsTypes` が **text** または **render** に設定されている場合に有効です。         | `string`                                                                           | -                 |
| `labelTipsRender`  | フォームコンポーネントのタイトルヒントのカスタムレンダリングメソッド。`labelTipsTypes` が **render** に設定されている場合に有効です。                | `(props: IComponentProps) => ReactNode`                                            | -                 |
| `labelTipsText`    | フォームコンポーネントのタイトルヒントのテキスト。`labelTipsTypes` が **text** に設定されている場合に有効です。                            | `string`                                                                           | -                 |
| `labelTipsTypes`   | フォームコンポーネントのタイトルヒントのタイプ設定                                                                        | [LabelTipsTypes](/ja/open/yida/components/interface#labeltipstypes)                | `'none'`          |
| `onChange`         | コンポーネントの値が変更されたときにトリガーされるイベント                                                                    | `({value: number})=> void`                                                         | -                 |
| `onOk`             | 「確定」をクリックしたときにトリガーされるイベント                                                                        | `({value: number})=> void`                                                         | -                 |
| `onVisibleChange`  | ポップアップレイヤーの表示・非表示が切り替わったときにトリガーされるイベント                                                           | `(visible: boolean) => void`                                                       | -                 |
| `placeholder`      | プレースホルダーヒント                                                                                      | `string`                                                                           | `'Please select'` |
| `resetTime`        | 日付を選択するたびに時刻をリセットするかどうか                                                                          | `boolean`                                                                          | `false`           |
| `returnType`       | 日付の戻り値タイプ                                                                                        | `'timestamp' \| 'string' \| 'moment'`                                              | `'timestamp'`     |
| `size`             | フォームコンポーネントのサイズ                                                                                  | [Size](/ja/open/yida/components/interface#size)                                    | `'medium'`        |
| `start`            | 日付の開始時刻。**type** 属性が `duration` の場合に有効です。                                                        | `number`                                                                           | -                 |
| `tips`             | フォームコンポーネントの説明文。コントロールの下に表示されます。                                                                 | `string`                                                                           | -                 |
| `type`             | 時間制限範囲                                                                                           | `'none' \| 'beforeToday' \| 'afterToday'\| 'duration'\| 'custom'`                  | `'none'`          |
| `validation`       | フォームコンポーネントのバリデーション設定。詳細は [フォームバリデーションドキュメント](/ja/open/yida/guide/concept/validation) を参照してください。 | [Validation\[\]](/ja/open/yida/components/interface#validation)                    | `[]`              |
| `value`            | 日付ピッカーのデフォルト値                                                                                    | `number`                                                                           | -                 |
| `wrapperColOffset` | フォームコンポーネントのオフセット位置を設定します。値はグリッド値で、1 は 1/24 を表します。                                               | `number`                                                                           | `0`               |
| `wrapperColSpan`   | フォームコンポーネントの幅を設定します。値はグリッド値で、1 は 1/24 を表します。                                                     | `number`                                                                           | `0`               |