Data Table
データを表形式で表示するコンポーネント。react-table](https://react-table.js.org/) の上に構築されています。
オプション
- data |
(array|object) (required): 表示されるデータオブジェクトまたは配列。オブジェクトの場合はキーがカラムの値に対応し、配列の場合は各カラムに対応する名前付きフィールドを持つオブジェクトの配列となります。. Default:none. - dataInfo |
object: オブジェクトには、データセットを記述する文字列配列info、データセットのname、変数名に対応するキーと変数の説明に対応する値を持つ変数のobject、起動時に情報モーダルを表示するかどうかを制御するブール値showOnStartupが含まれます。. Default:{ 'info': [], 'name': '', 'variables': null, 'showOnStartup': false }. - deletable |
boolean: infoが存在しないカラムにボタンがあるかどうかを制御します。. Default:false`. - undeletableVars |
array<string>: 削除されないカラムの変数名の配列. Default:[]. - filterable |
boolean: カラムがフィルタリング可能かどうかを制御します。. Default:true. - editable |
array: 編集可能なカラム名の配列. Default:[]. - getTrProps |
function: コールバック関数は、各行のスタイリングをカスタマイズするために実行されます (テーブルの状態、行の情報を渡します)。 列、およびテーブルインスタンス). Default:none. - onColumnDrag |
function: カラムが別の位置にドラッグされたときに呼び出される関数. Default:onColumnDrag() {}. - onColumnDelete |
function: カラムのそれぞれの削除ボタンがクリックされたときに、そのカラムの名前で呼び出される関数. Default:onColumnDelete() {}. - onColumnNameChange |
function: カラムの名前が変更されたときに呼び出される関数 (古い名前を第一引数、新しい名前を第二引数として呼び出されます). Default:onColumnNameChange() {}. - onClickRemove |
function: データから削除された行に対するアクションを指定する関数 (デフォルトは空の関数). Default:onClickRemove() {}. - onEdit |
function: 関数は、ユーザによってセルの値が変更された後、更新されたデータセットで呼び出されます (テーブルが編集可能の場合にのみ適用されます)。. Default:onEdit() {}. - onTutorialCompletion |
function: データテーブルのチュートリアルが完了したときに呼び出される関数. Default:onTutorialCompletion() {}. - filters |
array: フィルタの配列. Default:[]. - onFilteredChange |
function: 関数. Default:onFilteredChange() {}. - showRemove |
boolean: は、削除する行のチェックボックスを表示するかどうかを示します。. Default:false. - showIdColumn |
boolean: IDカラムを表示するかどうかを制御します。. Default:true. - disableDownload |
boolean: データをCSVまたはJSONファイルとしてダウンロードするボタンを非表示にするかどうか. Default:false. - className |
string: クラス名. Default:''. - style |
object: カスタム css スタイリングを可能にするオブジェクト。デフォルトは空のオブジェクト. Default:{}.
例としては、以下のようなものがあります。
ライブエディター
結果
ReferenceError: Provider is not defined