> ## Documentation Index
> Fetch the complete documentation index at: https://docs.morph-data.io/llms.txt
> Use this file to discover all available pages before exploring further.

# <DataTable />

<Frame>
  <img src="https://mintcdn.com/queue-4c50ebb3/_HQi-05AKdEsS8di/assets/images/pages/data-table.jpg?fit=max&auto=format&n=_HQi-05AKdEsS8di&q=85&s=7d6f8b8fca46ae15181f8f6692234d78" width="1280" height="720" data-path="assets/images/pages/data-table.jpg" />
</Frame>

DataTableコンポーネントは、Python関数やSQLファイルの実行結果をテーブル表示します。

```tsx theme={"dark"}
<DataTable 
  loadData="aggregate_py" 
  hederKeys={['name', 'email', 'department']}
  height={300} 
/>
```

## プロパティ

<ParamField path="loadData" type="string" required>
  Python関数やSQLファイルの name
</ParamField>

<ParamField path="variables" type="{ [key: string]: any }">
  Python関数やSQLファイルに渡す変数。 `defineState()`関数 を使って宣言してください。
</ParamField>

<ParamField path="height" type="number">
  テーブルの高さ。単位はpxです。
</ParamField>

<ParamField path="headerKeys" type="string[]">
  表示するカラムの名前。順番も指定できます。
</ParamField>
