> ## 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. # TableField 明細 > YiDA の TableField 明細コンポーネントリファレンス。1 件のメインレコードに複数の明細レコードが紐づく送信シナリオ向けに、サブフォームフィールド、行アクション、データの読み書きの設定方法を解説します。 ## 使用シーン * サブフォームの送信シナリオで使用します。 ## 型定義 ### カスタムアクション項目の設定構造 ```ts theme={"theme":{"light":"github-light","dark":"github-dark"}} interface Action { content: string; // アクション項目のラベル callback: ({index: number, groupId: string, itemValue: any, actionKey: string }) => void; // クリックコールバック render: ({index: number, groupId: string, itemValue: any, actionKey: string }) => ReactNode; // カスタムレンダリング } ``` ## コンポーネント例 ## コンポーネントプロパティ | 属性 | 説明 | タイプ | デフォルト | | ----------------------------------------- | ------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- | ------------- | | `actions` | カスタムアクション項目 | `Action[]` | `[]` | | `actionsColumnWidth` | アクション列の列幅（ピクセル単位） | `number` | `70` | | `addButtonBehavior` | 追加ボタンの操作可能状態 | `'NORMAL' \| 'DISABLED' \| 'HIDDEN'` | `NORMAL` | | `addButtonPosition` | 追加ボタンの位置 | `'bottom' \| 'top'` | `'bottom'` | | `addButtonText` | 追加ボタンのラベル | `string` | `'Add item'` | | `beforeAddClick` | 追加ボタンのクリック前に実行されるコールバック。false を返すと追加をブロックします。 | `() => boolean` | - | | `beforeCopyClick` | コピーボタンのクリック前に実行されるコールバック。false を返すとコピーをブロックします。 | `( sourceGroupId: string, sourceItem: any ) => boolean` | - | | `beforeDelClick` | 削除ボタンのクリック前に実行されるコールバック。false を返すと削除をブロックします。 | `( groupId: string , item: object ) => void` | - | | `beforeImportData` | データの一括インポート前に実行 | `( data: any[] ) => any[]` | - | | `behavior` | フォームコンポーネントの表示状態 | [Behavior](/ja/open/yida/components/interface#behavior) | `'NORMAL'` | | `columnsWidth` | フィールド列の列幅。例：\{ node\_ockzdxe6of1: '200px' } | `Record` | - | | `copyButtonText` | コピーボタンの名前 | `string` | `'Copy'` | | `delButtonText` | 削除ボタンの名前 | `string` | `'Delete'` | | `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'` | | `layoutSetting.indexName` | シーケンス番号の名前 | `string` | `'Item'` | | `layoutSetting.isFreezeOperateColumn` | アクション列を固定するかどうか | `boolean` | `true` | | `layoutSetting.layout` | レイアウトモード（TABLE モードは PC モードでのみ有効）。TILED：タイル型レイアウト、TABLE：テーブル型レイアウト。 | `'TILED' \| 'TABLE'` | `'TABLE'` | | `layoutSetting.pcFreezeColumnStartCounts` | 左側の固定列数。0 は列を固定しないことを意味します。 | `'0' \| '1' \| '2' \| '3'` | `0` | | `layoutSetting.showIndex` | シーケンス番号を表示するかどうか | `boolean` | `true` | | `layoutSetting.showTableHead` | テーブルヘッダーを表示するかどうか（PC のテーブルモードでのみ有効） | `boolean` | `true` | | `layoutSetting.theme` | 件名（PC のテーブルモードでのみ有効） | `'zebra' \| 'split' \| 'border'` | `'split'` | | `maxItems` | 最大項目数。上限は 500。 | `number` | `50` | | `moveDown` | 下へ移動ボタンの名前 | `string` | `'Move down'` | | `moveUp` | 上へ移動ボタンの名前 | `string` | `'Move up'` | | `onAddClick` | 追加ボタンのクリックイベント | `( newGroupId: string ) => void` | - | | `onChange` | サブフォームの値が変更されたときにトリガー | `({ value: any , extra: any }) => void` | - | | `onCopyClick` | コピーボタンのクリックイベント | `( newGroupId: string , copiedItem: any ) => void` | - | | `onDelClick` | 削除ボタンのクリックイベント | `( newGroupId: string , copiedItem: object ) => void` | - | | `pageSize` | 1 ページあたりの項目数 | `'10' \| '20' \| '30'` | `20` | | `showActions` | アクション列を表示するかどうか | `boolean` | `true` | | `showCopyAction` | コピーボタンを表示するかどうか | `boolean` | `false` | | `showDelAction` | 削除ボタンを表示するかどうか | `boolean` | `true` | | `showDeleteConfirm` | 削除確認を有効にするかどうか | `boolean` | `true` | | `showSortable` | 並べ替えを表示するかどうか（PC のテーブルモードでのみ有効） | `boolean` | `false` | | `size` | フォームコンポーネントのサイズ | [Size](/ja/open/yida/components/interface#size) | `'medium'` | | `tips` | フォームコンポーネントの説明。コントロールの下部に表示されます。 | `string` | - | | `useCustomColumnsWidth` | その他の列の幅をカスタマイズするかどうか | `boolean` | `false` | | `validation` | フォームコンポーネントのバリデーション設定。詳細は [フォームバリデーションのドキュメント](/ja/open/yida/guide/concept/validation) を参照してください。 | [Validation\[\]](/ja/open/yida/components/interface#validation) | `[]` | | `value` | 明細コンポーネントのデフォルト値 | `any[]` | `[]` | | `wrapperColOffset` | フォームコンポーネントのオフセット位置。値はグリッド値で、1 は 1/24 を表します。 | `number` | `0` | | `wrapperColSpan` | フォームコンポーネントのプレースホルダ幅。値はグリッド値で、1 は 1/24 を表します。 | `number` | `0` |