> ## 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.

# CascadeDateField 日付範囲

> YiDA の CascadeDateField 日付範囲コンポーネントの設定リファレンス。範囲フォーマット、日付制限、各種プロパティの設定方法を解説し、ポップアップパネルから開始日と終了日を選択する方法を紹介します。

## 使用シーン

* 日付範囲の入力・選択に使用します。ユーザーが日付範囲を入力する必要がある場合、標準の入力ボックスをクリックすると日付パネルが開き、選択できます。

## コンポーネントの例

## コンポーネントプロパティ

| 属性                 | 説明                                                                                         | タイプ                                                                                                 | デフォルト             |
| ------------------ | ------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------- | ----------------- |
| `behavior`         | フォームコンポーネントの表示状態                                                                           | [Behavior](/ja/open/yida/components/interface#behavior)                                             | `'NORMAL'`        |
| `disabledDate`     | カスタム制限。**type** プロパティが custom の場合に有効                                                       | `(current: number)=> boolean`                                                                       | -                 |
| `format`           | 日付範囲コンポーネントの表示フォーマット                                                                       | `'YYYY' \| 'YYYY-MM' \| 'YYYY-MM-DD' \| 'YYYY-MM-DD HH:mm' \| 'YYYY-MM-DD HH:mm'YYY-MM-DD HH:mm:ss` | `'YYY-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：object}) => void`                                                                          | -                 |
| `onOk`             | 「確定」をクリックしたときにトリガーされるイベント                                                                  | `(value: object) => void`                                                                           | -                 |
| `onVisibleChange`  | ポップアップパネルの表示・非表示が切り替わったときにトリガーされるイベント                                                      | `(visible：boolean) => void`                                                                         | -                 |
| `placeholder`      | フォームコンポーネントのプレースホルダーテキスト                                                                   | `string`                                                                                            | `'Please select'` |
| `ranges`           | クイック範囲選択                                                                                   | `()=> number[]`                                                                                     | -                 |
| `resetTime`        | 日付を選択するたびに時刻をリセットするかどうか                                                                    | `boolean`                                                                                           | `false`           |
| `returnType`       | 日付範囲の戻り値タイプ                                                                                | `'timestamp' \| 'string' \| 'moment'`                                                               | `'timestamp'`     |
| `size`             | フォームコンポーネントのサイズ                                                                            | [Size](/ja/open/yida/components/interface#size)                                                     | `'medium'`        |
| `tips`             | フォームコンポーネントの説明。コントロールの下に表示されます                                                             | `string`                                                                                            | -                 |
| `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`               |