跳到內容

GridApiAPI

GridApi 介面的擴充文件,其中包含關於模組屬性和可用 API 的詳細資訊。

示範

匯入

import { GridApi } from '@mui/x-data-grid-premium'
// or
import { GridApi } from '@mui/x-data-grid-pro'
// or
import { GridApi } from '@mui/x-data-grid'


完整的網格 API。

屬性

將欄位新增至列分組模型。

類型:(groupingCriteriaField: string, groupingIndex?: number) => void


將目前的排序模型套用至列。

類型:() => void


根據儲存格內容和可用空間自動調整網格欄的大小。

類型:(options?: GridAutosizeOptions) => Promise<void>


刪除 GridFilterItem

類型:(item: GridFilterItem) => void


下載並匯出網格資料的 CSV 檔。

類型:(options?: GridCsvExportOptions) => void


下載並匯出網格資料的 Excel 檔案。

類型:(options?: GridExcelExportOptions) => Promise<void>


列印網格資料。

類型:(options?: GridPrintExportOptions) => void


產生包含 DataGrid 狀態中可匯出部分的序列化物件。
這些值隨後可以傳遞至 initialState 屬性,或使用 restoreState 方法注入。

類型:(params?: GridExportStateParams) => InitialState


強制網格重新渲染。通常在狀態更新後使用。

類型:() => void


傳回 GridColDef 的陣列,其中包含所有欄定義。

類型:() => GridStateColDef[]


傳回欄群組查詢表。

類型:() => GridColumnGroupLookup


取得列 ID 清單。

類型:() => GridRowId[]


取得在事件中作為引數傳遞的 GridCellParams 物件。

類型:(id: GridRowId, field: string) => HTMLDivElement | null


取得儲存格的模式。

類型:(id: GridRowId, field: string) => GridCellMode


取得在事件中作為引數傳遞的 GridCellParams 物件。

類型:<R extends GridValidRowModel = any, V = unknown, F = V, N extends GridTreeNode = GridTreeNode>(id: GridRowId, field: string) => GridCellParams<R, V, F, N>


傳回包含儲存格選取狀態的物件。
物件的鍵對應於列 ID。
每個鍵的值也是一個物件,該物件具有作為鍵的欄位,以及作為其選取狀態的布林值。

類型:() => GridCellSelectionModel


取得給定 idfield 的儲存格值。

類型:<V extends any = any>(id: GridRowId, field: string) => V


傳回給定 fieldGridColDef

類型:(field: string) => GridStateColDef


傳回導向至請求欄的群組 ID。
陣列依深度遞增排序(最後一個元素是欄的直接父項)。

類型:(field: string) => GridColumnGroup['groupId'][]


取得具有給定 field 的欄標題的底層 DOM 元素。

類型:(field: string) => HTMLDivElement | null


取得在事件中作為引數傳遞的 GridColumnHeaderParams 物件。

類型:(field: string) => GridColumnHeaderParams


傳回欄的索引位置。預設情況下,僅考慮可見欄。
傳遞 falseuseVisibleColumns 以考慮所有欄。

類型:(field: string, useVisibleColumns?: boolean) => number


取得相對於可透過滾動觸及的欄的欄索引。

類型:(field: string) => number


傳回欄的左側位置,相對於網格的內部邊框。

類型:(field: string) => number


以 CSV 字串形式傳回網格資料。
此方法由 exportDataAsCsv 內部使用。

類型:(options?: GridCsvExportOptions) => string


以 exceljs 工作簿形式傳回網格資料。
此方法由 exportDataAsExcel 內部使用。

類型:(options?: GridExcelExportOptions) => Promise<Excel.Workbook> | null


傳回詳細資訊面板為開啟狀態的列。

類型:() => GridRowId[]


傳回給定篩選模型的篩選狀態,而不會將其套用至資料網格。

類型:(filterModel: GridFilterModel) => GridStateCommunity['filter']


傳回 key 的翻譯。

類型:<T extends GridTranslationKeys>(key: T) => GridLocaleText[T]


傳回釘選的欄。

類型:() => GridPinnedColumnFields


在套用列選取傳播後,傳回修改後的選取模型。

當使用 setRowSelectionModel 設定選取模型時,使用此選項可實現正確的 rowSelectionPropagation 行為。

類型:(inputSelectionModel: GridRowSelectionModel) => GridRowSelectionModel


傳回網格的尺寸

類型:() => GridDimensions


取得具有給定 ID 的列資料。

類型:<R extends GridValidRowModel = any>(id: GridRowId) => R | null


取得給定 id 的列的底層 DOM 元素。

類型:(id: GridRowId) => HTMLDivElement | null


取得分組條件的列。
僅包含提供給網格的列,而不包含網格自動產生的列。

類型:(params: GridRowGroupChildrenGetterParams) => GridRowId[]


取得給定資料列的 ID。

類型:<R extends GridValidRowModel = any>(row: R) => GridRowId


取得特定索引處的列的 GridRowId
索引基於已排序但未篩選的列清單。

類型:(index: number) => GridRowId


取得相對於可透過滾動觸及的列的列索引。

類型:(id: GridRowId) => number


取得列的模式。

類型:(id: GridRowId) => GridRowMode


以 Map<GridRowId, GridRowModel> 形式取得完整列集。

類型:() => Map<GridRowId, GridRowModel>


從內部樹狀結構取得列節點。

類型:<N extends GridTreeNode>(id: GridRowId) => N | null


取得在事件中作為引數傳遞的 GridRowParams 物件。

類型:(id: GridRowId) => GridRowParams


取得網格中的列總數。

類型:() => number


傳回具有透過編輯儲存格設定的值的列。
在列編輯中,field 會被忽略,且會考慮所有欄位。

類型:(id: GridRowId, field: string) => GridRowModel


傳回目前的滾動位置。

類型:() => GridScrollParams


傳回僅包含選取儲存格的陣列。
每個項目都是一個物件,其中包含儲存格的 ID 和欄位。

類型:() => GridCellCoordinates[]


傳回選取列的陣列。

類型:() => Map<GridRowId, GridRowModel>


傳回根據使用中排序模型排序的所有列 ID。

類型:() => GridRowId[]


傳回根據使用中排序模型排序的所有列。

類型:() => GridRowModel[]


傳回目前套用至網格的排序模型。

類型:() => GridSortModel


傳回目前可見的欄。

類型:() => GridStateColDef[]


隱藏已開啟的欄選單。

類型:() => void


隱藏篩選面板。

類型:() => void


隱藏標題篩選選單。

類型:() => void


隱藏偏好設定面板。

類型:() => void


傳回 ignoreDiacritics 屬性的值。

類型:DataGridProcessedProps['ignoreDiacritics']


控制儲存格是否可編輯。

類型:(params: GridCellParams) => boolean


判斷儲存格是否已選取。

類型:(id: GridRowId, field: GridColDef['field']) => boolean


傳回欄釘選至哪一側。

類型:(field: string) => GridPinnedColumnPosition | false


判斷列是否可選取。

類型:(id: GridRowId) => boolean


判斷列是否已選取。

類型:(id: GridRowId) => boolean


將欄釘選至網格的左側或右側。

類型:(field: string, side: GridPinnedColumnPosition) => void


發出事件。

類型:GridEventPublisher


從列分組模型中移除欄位。

類型:(groupingCriteriaField: string) => void


強制重新計算所有列的高度。

類型:() => void


觸發元件的大小調整和寬度與高度的重新計算。

類型:() => void


將給定值注入 DataGrid 的狀態。

類型:(stateToRestore: InitialState) => void


觸發視口滾動到給定位置(以像素為單位)。

類型:(params: Partial<GridScrollParams>) => void


觸發視口滾動到 params 給定索引的儲存格。
如果網格必須滾動才能到達目標,則傳回 true

類型:(params: Partial<GridCellIndexCoordinates>) => boolean


選取 startend 座標給定範圍內的所有儲存格。

類型:(start: GridCellCoordinates, end: GridCellCoordinates, keepOtherSelected?: boolean) => void


變更列的選取狀態。

類型:(id: GridRowId, isSelected?: boolean, resetSelection?: boolean) => void


變更範圍內所有可選取列的選取狀態。

類型:(range: { startId: GridRowId; endId: GridRowId }, isSelected?: boolean, resetSelection?: boolean) => void


變更多個列的選取狀態。

類型:(ids: GridRowId[], isSelected?: boolean, resetSelection?: boolean) => void


將彙總模型設定為 model 給定的模型。

類型:(model: GridAggregationModel) => void


將焦點設定在給定 idfield 的儲存格上。

類型:(id: GridRowId, field: string) => void


根據傳遞至 newModel 引數的值更新儲存格選取模型。
任何已選取的儲存格都將取消選取。

類型:(newModel: GridCellSelectionModel) => void


將焦點設定在給定 field 的欄標題篩選器。

類型:(field: string, event?: MuiBaseEvent) => void


將焦點設定在給定 field 的欄標題。

類型:(field: string, event?: MuiBaseEvent) => void


將欄從其原始位置移動到 targetIndexPosition 給定的位置。

Type:(field: string, targetIndexPosition: number) => void


變更由 field 參照的欄位的可見性。

Type:(field: string, isVisible: boolean) => void


將欄位可見性模型設定為 model 所給定的模型。

Type:(model: GridColumnVisibilityModel) => void


更新欄位的寬度。

Type:(field: string, width: number) => void


設定網格的密度。

Type:(density: GridDensity) => void


設定編輯儲存格的值。
常用於編輯儲存格元件內部。

Type:(params: GridEditCellValueParams, event?: MuiBaseEvent) => Promise<boolean> | void


變更要展開詳細資訊面板的列。

Type:(ids: GridRowId[]) => void


變更用於連接篩選器的 GridLogicOperator。

Type:(operator: GridLogicOperator) => void


將篩選器模型設定為 model 所給定的模型。

Type:(model: GridFilterModel, reason?: GridControlledStateReasonLookup['filter']) => void


設定內部載入狀態。

Type:(loading: boolean) => void


將顯示的頁面設定為 page 所給定的值。

Type:(page: number) => void


將顯示的列數設定為 pageSize 所給定的值。

Type:(pageSize: number) => void


paginationMeta 設定為新值。

Type:(paginationMeta: GridPaginationMeta) => void


paginationModel 設定為新值。

Type:(model: GridPaginationModel) => void


變更釘選的欄位。

Type:(pinnedColumns: GridPinnedColumnFields) => void


將快速篩選器值設定為 values 所給定的值

Type:(values: any[]) => void


展開或摺疊列的子項目。

Type:(id: GridRowId, isExpanded: boolean) => void


rowCount 設定為新值。

Type:(rowCount: number) => void


設定分組條件的分組索引。

Type:(groupingCriteriaField: string, groupingIndex: number) => void


設定要用作分組條件的欄位。

Type:(model: GridRowGroupingModel) => void


將列從其原始位置移動到 targetIndex 所給定的位置。

Type:(rowId: GridRowId, targetIndex: number) => void


設定一組新的列。

Type:(rows: GridRowModel[]) => void


設定新的列選取模型。

⚠️ 注意:setRowSelectionModel 不會自動套用選取傳播。
請改為傳遞 API 方法 getPropagatedRowSelectionModel 傳回的模型,以套用選取傳播。

Type:(rowSelectionModel: GridRowSelectionModel) => void


更新排序模型並觸發列的排序。

Type:(model: GridSortModel) => void


field 欄位下顯示欄位選單。

Type:(field: string) => void


顯示篩選器面板。如果給定 targetColumnField,也會為此欄位新增篩選器。

Type:(targetColumnField?: string, panelId?: string, labelId?: string) => void


為給定的欄位開啟標頭篩選器選單。

Type:(field: GridColDef['field']) => void


顯示偏好設定面板。newValue 引數控制面板的內容。

Type:(newValue: GridPreferencePanelsValue, panelId?: string, labelId?: string) => void


排序欄位。

Type:(field: GridColDef['field'], direction?: GridSortDirection, allowMultipleSorting?: boolean) => void


將與給定的列 ID 和欄位對應的儲存格設為編輯模式。

Type:(params: GridStartCellEditModeParams) => void


將與給定的列 ID 和欄位對應的儲存格設為編輯模式。

Type:(field: GridColDef['field']) => void


將與給定的 ID 對應的列設為編輯模式。

Type:(params: GridStartRowEditModeParams) => void


包含網格完整狀態的屬性。

Type:State


將與給定的列 ID 和欄位對應的儲存格設為檢視模式,並使用儲存的新值更新原始列。
如果 params.ignoreModificationstrue,則會捨棄所做的修改。

Type:(params: GridStopCellEditModeParams) => void


停止目前欄位的編輯模式。

類型:() => void


將與給定的 ID 對應的列設為檢視模式,並使用儲存的新值更新原始列。
如果 params.ignoreModificationstrue,則會捨棄所做的修改。

Type:(params: GridStopRowEditModeParams) => void


為事件註冊處理常式。

Type:<E extends GridEvents>(event: E, handler: GridEventListener<E>, options?: EventListenerOptions) => () => void


切換 field 欄位下的欄位選單。

Type:(field: string) => void


展開或摺疊列的詳細資訊面板。

Type:(id: GridRowId) => void


取消釘選欄位。

Type:(field: string) => void


資料來源 API。

Type:GridDataSourceApiBase


以新列取代一組列。

Type:(firstRowToReplace: number, newRows: GridRowModel[]) => void


啟用/停用欄位虛擬化。

Type:(enabled: boolean) => void


變更釘選的列。

Type:(pinnedRows?: GridPinnedRowsProp) => void


啟用/停用虛擬化。

Type:(enabled: boolean) => void


同時更新多個欄位的定義。

Type:(cols: GridColDef[]) => void


允許更新、插入和刪除列。

Type:(updates: GridRowModelUpdate[]) => void


更新或插入 GridFilterItem

類型:(item: GridFilterItem) => void


更新或插入多個 GridFilterItem

Type:(items: GridFilterItem[]) => void