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

# AttachmentField 添付アップロード

> YiDA の AttachmentField 添付アップロードコンポーネントの設定方法を解説します。ファイルタイプ制限、アップロード上限、アップロードイベントなど、フォームでファイルをアップロード・送信するための各種プロパティを紹介します。

## 使用シーン

* ファイルのアップロードおよび送信が必要なシーンで利用します。

## コンポーネント例

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

| 属性                 | 説明                                                                                                | タイプ                                                                 | デフォルト           |
| ------------------ | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | --------------- |
| `accept`           | アップロード可能なファイルタイプを設定します（複数指定する場合はカンマ区切り）。例：.doc、.docx、.pdf。                                        | `string`                                                            | -               |
| `autoUpload`       | 自動でアップロードするかどうか。無効にした場合は、`this.$('fieldId').startUpload()` を手動で呼び出してアップロードを開始する必要があります。           | `boolean`                                                           | `true`          |
| `beforeUpload`     | アップロード前の処理イベント。                                                                                   | `(file: object, options: object) => void`                           | -               |
| `behavior`         | フォームコンポーネントの表示状態。                                                                                 | [Behavior](/ja/open/yida/components/interface#behavior)             | `'NORMAL'`      |
| `buttonSize`       | ボタンのサイズを設定します。                                                                                    | `'small' \| 'medium' \| 'large'`                                    | `'medium'`      |
| `buttonText`       | ボタンのコンテンツを設定します。                                                                                  | `string`                                                            | `'Upload File'` |
| `buttonType`       | ボタンのタイプを設定します。                                                                                    | `'primary' \| 'secondary' \| 'normal'`                              | `'primary'`     |
| `customUploadPane` | カスタムパネル。                                                                                          | `() => ReactNode`                                                   | -               |
| `data`             | アップロード時に付加する追加パラメータを設定します。                                                                        | `Record<string, string>`                                            | `{}`            |
| `formatter`        | データ処理イベント。                                                                                        | `(response: any) => any`                                            | -               |
| `headers`          | アップロード時のリクエストヘッダーを設定します。                                                                          | `Record<string, string>`                                            | `{}`            |
| `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'`        |
| `limit`            | アップロード可能なファイルの最大数を設定します。                                                                          | `number`                                                            | `9`             |
| `maxFileSize`      | 1 ファイルあたりの最大サイズ（MB 単位）を設定します。                                                                     | `number`                                                            | `50`            |
| `multiple`         | 複数ファイルのアップロードに対応するかどうか。                                                                           | `boolean`                                                           | `true`          |
| `name`             | アップロード時にサーバーサイドへ送信する名前。                                                                           | `string`                                                            | -               |
| `onCancel`         | ユーザーがアップロードをキャンセルしたときにトリガーされるイベント。                                                                | `() => void`                                                        | -               |
| `onChange`         | コンポーネントの値が変化したときにトリガーされるイベント。                                                                     | `({ value: object }) => void`                                       | -               |
| `onDragLeave`      | ドラッグ操作がコンポーネントから離れたときにトリガーされるイベント。                                                                | `() => void`                                                        | -               |
| `onDragOver`       | ドラッグ操作がコンポーネントの上を通過したときにトリガーされるイベント。                                                              | `() => void`                                                        | -               |
| `onDrop`           | ドラッグ操作がコンポーネント上で完了したときにトリガーされるイベント。                                                               | `() => void`                                                        | -               |
| `onError`          | コンポーネントのアップロードに失敗したときにトリガーされるイベント。                                                                | `(file: object, value: array) => void`                              | -               |
| `onProgress`       | コンポーネントのアップロード中にトリガーされるイベント。                                                                      | `() => void`                                                        | -               |
| `onRemove`         | ユーザーがアップロード済みのファイルを削除したときにトリガーされるイベント。                                                            | `(file: object) => void`                                            | -               |
| `onSelect`         | ファイルが選択されたときにトリガーされるイベント。                                                                         | `(file: object) => void`                                            | -               |
| `onSuccess`        | コンポーネントのアップロードに成功したときにトリガーされるイベント。                                                                | `(file: object, value: array) => void`                              | -               |
| `size`             | フォームコンポーネントのサイズ。                                                                                  | [Size](/ja/open/yida/components/interface#size)                     | `'medium'`      |
| `timeout`          | アップロードのタイムアウト時間をミリ秒単位で設定します。                                                                      | `number`                                                            | `0`             |
| `tips`             | フォームコンポーネントの説明。コントロールの下に表示されます。                                                                   | `string`                                                            | -               |
| `type`             | アップロードタイプを設定します。PC でのみ有効です。                                                                       | `'normal' \| 'drag'`                                                | `'normal'`      |
| `validation`       | フォームコンポーネントのバリデーション設定。詳しくは [フォームバリデーションドキュメント](/ja/open/yida/guide/concept/validation) を参照してください。 | [Validation\[\]](/ja/open/yida/components/interface#validation)     | `[]`            |
| `value`            | デフォルト値。                                                                                           | `array`                                                             | -               |
| `withCredentials`  | リクエストで Cookie の送信を許可するかどうか。                                                                       | `boolean`                                                           | `false`         |
| `wrapperColOffset` | フォームコンポーネントのオフセット位置を設定します。値はグリッド単位で、1 は 1/24 を表します。                                               | `number`                                                            | `0`             |
| `wrapperColSpan`   | フォームコンポーネントのプレースホルダ幅を設定します。値はグリッド単位で、1 は 1/24 を表します。                                              | `number`                                                            | `0`             |
