---
pkg: "@nocobase/plugin-block-grid-card"
---
# グリッドカード

## はじめに

グリッドカードブロックは、データレコードの概要情報をカード形式で表示します。異なる画面サイズに合わせて列数を設定できるため、さまざまなデバイスで使いやすく表示されます。

## ブロック設定

![20251023205037](https://static-docs.nocobase.com/20251023205037.png)

### データ範囲

![20251023205425](https://static-docs.nocobase.com/20251023205425.png)

詳細については、[データ範囲の設定](/interface-builder/blocks/block-settings/data-scope) を参照してください。

### 1行あたりの列数の設定

![20251023210137](https://static-docs.nocobase.com/20251023210137.gif)

異なる画面サイズに合わせて列数を設定できます。

![20251023210303](https://static-docs.nocobase.com/20251023210303.png)

## フィールドの設定

### このコレクションのフィールド

![20251023210533](https://static-docs.nocobase.com/20251023210533.png)

### 関連コレクションのフィールド

![20251023210629](https://static-docs.nocobase.com/20251023210629.png)

グリッドカードブロックのフィールド設定項目については、[詳細フィールド](/interface-builder/fields/generic/detail-form-item) を参照してください。

## アクションの設定

### グローバルアクション

![20251023211330](https://static-docs.nocobase.com/20251023211330.png)

- [フィルター](/interface-builder/actions/types/filter)
- [新規追加](/interface-builder/actions/types/add-new)
- [削除](/interface-builder/actions/types/delete)
- [更新](/interface-builder/actions/types/refresh)
- [インポート](/interface-builder/actions/types/import)
- [エクスポート](/interface-builder/actions/types/export)
- [テンプレート印刷](/template-print/index)
- [一括更新](/interface-builder/actions/types/bulk-update)
- [添付ファイルのエクスポート](/interface-builder/actions/types/export-attachments)
- [ワークフローのトリガー](/interface-builder/actions/types/trigger-workflow)
- [AIアシスタント](/interface-builder/actions/types/ai-employee)
- [JSアクション](/interface-builder/actions/types/js-action)

### 行アクション

![20251023211054](https://static-docs.nocobase.com/20251023211054.png)

- [編集](/interface-builder/actions/types/edit)
- [削除](/interface-builder/actions/types/delete)
- [リンク](/interface-builder/actions/types/link)
- [ポップアップ](/interface-builder/actions/types/pop-up)
- [レコードの更新](/interface-builder/actions/types/update-record)
- [テンプレート印刷](/template-print/index)
- [ワークフローのトリガー](/interface-builder/actions/types/trigger-workflow)
- [AIアシスタント](/interface-builder/actions/types/ai-employee)
- [JSアクション](/interface-builder/actions/types/js-action)