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

# SelectField ドロップダウン選択

> YiDA の SelectField ドロップダウン選択コンポーネントの公式ドキュメント。オプションのデータソース、検索、連動などの属性設定により、限られた選択肢から 1 つを選ぶ機能を実装する方法を解説します。

## 利用シーン

* ネイティブの select を置き換え、限られた選択肢から 1 つを選ぶ場面で使用します。コア機能は「選択」です。

## コンポーネントの例

## コンポーネントの属性

| 属性                 | 説明                                                                                        | タイプ                                                                 | デフォルト                                                                                                               |
| ------------------ | ----------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------- |
| `autoWidth`        | ドロップダウンメニューの幅をセレクタと揃えるかどうか。                                                               | `boolean`                                                           | `true`                                                                                                              |
| `behavior`         | フォームコンポーネントの表示状態。                                                                         | [Behavior](/ja/open/yida/components/interface#behavior)             | `'NORMAL'`                                                                                                          |
| `dataSource`       | オプションを設定します。                                                                              | [DataSource\[\]](/ja/open/yida/components/interface#datasource)     | `[ { "text": "オプション 1", "value": "1" }, { "text": "オプション 2", "value": "2" }, { "text": "オプション 3", "value": "3" } ]` |
| `filter`           | ローカルフィルタリングの方式。ローカルフィルタリングが有効な場合のみ適用されます。                                                 | `(value: string, data: DataSource) => boolean`                      | -                                                                                                                   |
| `filterLocal`      | ローカルフィルタリングをサポートするかどうか。データソースがリモートの場合はオフにしてください。                                          | `boolean`                                                           | -                                                                                                                   |
| `hasArrow`         | ドロップダウン矢印を表示するかどうか。                                                                       | `boolean`                                                           | `true`                                                                                                              |
| `hasBorder`        | 枠線を表示するかどうか。                                                                              | `boolean`                                                           | `true`                                                                                                              |
| `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'`                                                                                                            |
| `notFoundContent`  | 一致するオプションがない場合に表示されるテキスト。                                                                 | `string`                                                            | `'入力してください'`                                                                                                        |
| `onChange`         | コンポーネントの値が変更されたときにトリガーされるイベント。                                                            | `(value: string) => void`                                           | -                                                                                                                   |
| `onRemove`         | 値が削除されたときにトリガーされるイベント。                                                                    | `(item: object) => void`                                            | -                                                                                                                   |
| `onSearch`         | 検索ボックスの値が変更されたときにトリガーされるイベント。                                                             | `(keyword: string) => void`                                         | -                                                                                                                   |
| `onVisibleChange`  | ドロップダウンの表示・非表示が切り替わったときにトリガーされるイベント。                                                      | `(visible: boolean) => void`                                        | -                                                                                                                   |
| `placeholder`      | フォームコンポーネントのプレースホルダーテキスト。                                                                 | `string`                                                            | `'選択してください'`                                                                                                        |
| `searchDelay`      | 検索の遅延時間（ミリ秒）。                                                                             | `number`                                                            | `300`                                                                                                               |
| `showSearch`       | ドロップダウン展開後に検索を有効にするかどうか。タグモードでは常に true になります。                                             | `boolean`                                                           | `true`                                                                                                              |
| `size`             | フォームコンポーネントのサイズ。                                                                          | [Size](/ja/open/yida/components/interface#size)                     | `'medium'`                                                                                                          |
| `tips`             | フォームコンポーネントの説明テキスト。コントロールの下に表示されます。                                                       | `string`                                                            | -                                                                                                                   |
| `useDetailValue`   | 値にオブジェクトタイプ \{label, value} を使用するかどうか。                                                    | `boolean`                                                           | `false`                                                                                                             |
| `validation`       | フォームバリデーションの設定。詳細は [フォームバリデーションドキュメント](/ja/open/yida/guide/concept/validation) を参照してください。 | [Validation\[\]](/ja/open/yida/components/interface#validation)     | `[]`                                                                                                                |
| `value`            | 現在のコンポーネントのデフォルト値。                                                                        | `string`                                                            | -                                                                                                                   |
| `wrapperColOffset` | フォームコンポーネントのオフセット位置。値はグリッド単位で、1 は 1/24 を表します。                                             | `number`                                                            | `0`                                                                                                                 |
| `wrapperColSpan`   | フォームコンポーネント領域の幅。値はグリッド単位で、1 は 1/24 を表します。                                                 | `number`                                                            | `0`                                                                                                                 |