アクション付きデータテーブルActionDataTableExperimental
行選択、一括操作、行操作を組み合わせたデータテーブルです。
プレビュー
1 - 10 / 全300件
1 / 30
0
選択中| 行操作 | |||||
|---|---|---|---|---|---|
| 春の新生活バナー | 青井 花 | 公開中 | 2026-05-28 | ||
| アプリ訴求 LP | 田中 空 | 下書き | 2026-05-27 | ||
| 法人向け資料広告 | 山本 優 | 公開中 | 2026-05-26 | ||
| 旧キャンペーン素材 | 小林 真央 | 保管済み | 2026-05-25 | ||
| 展示会フォロー | 中村 蓮 | 下書き | 2026-05-24 | ||
| 採用サイト告知 | 佐藤 葵 | 公開中 | 2026-05-23 | ||
| 店舗向け予約導線 | 伊藤 陽 | 公開中 | 2026-05-22 | ||
| 夏季キャンペーン | 高橋 澪 | 下書き | 2026-05-21 | ||
| 資料請求リターゲティング | 渡辺 凛 | 公開中 | 2026-05-20 | ||
| 法人向けメール施策 | 加藤 蒼 | 保管済み | 2026-05-19 |
状態とバリエーション
選択と一括操作
行を選択すると一括操作が有効になり、未選択時は理由をツールチップで説明します。
1 - 10 / 全300件
1 / 30
0
選択中| 行操作 | |||||
|---|---|---|---|---|---|
| 春の新生活バナー | 青井 花 | 公開中 | 2026-05-28 | ||
| アプリ訴求 LP | 田中 空 | 下書き | 2026-05-27 | ||
| 法人向け資料広告 | 山本 優 | 公開中 | 2026-05-26 | ||
| 旧キャンペーン素材 | 小林 真央 | 保管済み | 2026-05-25 | ||
| 展示会フォロー | 中村 蓮 | 下書き | 2026-05-24 | ||
| 採用サイト告知 | 佐藤 葵 | 公開中 | 2026-05-23 | ||
| 店舗向け予約導線 | 伊藤 陽 | 公開中 | 2026-05-22 | ||
| 夏季キャンペーン | 高橋 澪 | 下書き | 2026-05-21 | ||
| 資料請求リターゲティング | 渡辺 凛 | 公開中 | 2026-05-20 | ||
| 法人向けメール施策 | 加藤 蒼 | 保管済み | 2026-05-19 |
行操作
各行の操作は右端に固定し、無効な行操作は理由をツールチップで表示します。
1 - 10 / 全300件
1 / 30
0
選択中| 行操作 | |||||
|---|---|---|---|---|---|
| 春の新生活バナー | 青井 花 | 公開中 | 2026-05-28 | ||
| アプリ訴求 LP | 田中 空 | 下書き | 2026-05-27 | ||
| 法人向け資料広告 | 山本 優 | 公開中 | 2026-05-26 | ||
| 旧キャンペーン素材 | 小林 真央 | 保管済み | 2026-05-25 | ||
| 展示会フォロー | 中村 蓮 | 下書き | 2026-05-24 | ||
| 採用サイト告知 | 佐藤 葵 | 公開中 | 2026-05-23 | ||
| 店舗向け予約導線 | 伊藤 陽 | 公開中 | 2026-05-22 | ||
| 夏季キャンペーン | 高橋 澪 | 下書き | 2026-05-21 | ||
| 資料請求リターゲティング | 渡辺 凛 | 公開中 | 2026-05-20 | ||
| 法人向けメール施策 | 加藤 蒼 | 保管済み | 2026-05-19 |
プロパティ
表は横にスクロールできます
| プロパティ | 型 | 初期値 | 説明 |
|---|---|---|---|
| columns | ColumnDef<TData, TValue>[] | - | 表示列です。選択列と行操作列は ActionDataTable が追加します。 |
| data | TData[] | - | 表示する行データです。 |
| getRowId | (row: TData, index: number) => string | - | 選択状態を維持するための安定した行 ID を返します。 |
| getRowLabel | (row: TData, index: number) => string | - | 行選択チェックボックスのアクセシブル名に使うラベルです。 |
| enableSelection | boolean | true | 行選択列を表示するかどうかです。 |
| rowActions | ActionDataTableRowAction<TData>[] | - | 各行の右端に表示する操作です。無効理由はツールチップで説明します。 |
| bulkActions | ActionDataTableBulkAction<TData>[] | - | 選択行に対して実行する一括操作です。 |
| labels | ActionDataTableLabels | - | DataTable の文言に加えて、選択・一括操作・行操作の文言を差し替えます。 |
使い方
Loading...