Migration from v5 to v6
This guide describes the changes needed to migrate the Data Grid from v5 to v6.
Start using the alpha release
In package.json
, change the version of the data grid package to next
.
-"@mui/x-data-grid": "latest",
+"@mui/x-data-grid": "next",
Using next
ensures that it will always use the latest v6 alpha release, but you can also use a fixed version, like 6.0.0-alpha.0
.
Breaking changes
Since v6 is a major release, it contains some changes that affect the public API. These changes were done for consistency, improve stability and make room for new features. Below are described the steps you need to make to migrate from v5 to v6.
Renamed props
To avoid confusion with the props that will be added for the cell selection feature, some props related to row selection were renamed to have "row" in their name. The renamed props are the following:
Old name New name selectionModel
rowSelectionModel
onSelectionModelChange
onRowSelectionModelChange
disableSelectionOnClick
disableRowSelectionOnClick
disableMultipleSelection
disableMultipleRowSelection
Removed props
- The
disableIgnoreModificationsIfProcessingProps
prop was removed and its behavior whentrue
was incorporated as the default behavior. The old behavior can be restored by usingapiRef.current.stopRowEditMode({ ignoreModifications: true })
orapiRef.current.stopCellEditMode({ ignoreModifications: true })
. - The
onColumnVisibilityChange
prop was removed. UseonColumnVisibilityModelChange
instead.
State access
- The
gridSelectionStateSelector
selector was renamed togridRowSelectionStateSelector
. - The
gridColumnsSelector
selector was removed. Use more specific grid columns selectors instead. - The
allGridColumnsFieldsSelector
selector was removed. UsegridColumnFieldsSelector
instead. - The
allGridColumnsSelector
selector was removed. UsegridColumnDefinitionsSelector
instead. - The
visibleGridColumnsSelector
selector was removed. UsegridVisibleColumnDefinitionsSelector
instead. - The
filterableGridColumnsSelector
selector was removed. UsegridFilterableColumnDefinitionsSelector
instead. - The
filterableGridColumnsIdsSelector
selector was removed. UsegridFilterableColumnLookupSelector
instead. - The
visibleGridColumnsLengthSelector
selector was removed. UsegridVisibleColumnDefinitionsSelector
instead. - The
gridColumnsMetaSelector
selector was removed. UsegridColumnsTotalWidthSelector
orgridColumnPositionsSelector
instead. - The
getGridNumericColumnOperators
selector was removed. UsegetGridNumericOperators
instead. - The
gridVisibleRowsSelector
selector was removed. UsegridVisibleSortedRowIdsSelector
instead. - The
gridRowGroupingStateSelector
selector was removed. - The
gridFilterStateSelector
selector was removed. - The
gridRowsStateSelector
selector was removed. - The
gridSortingStateSelector
selector was removed.
Events
- The
selectionChange
event was renamed torowSelectionChange
. - The
rowsScroll
event was renamed toscrollPositionChange
. - The
columnVisibilityChange
event was removed. UsecolumnVisibilityModelChange
instead. - The
cellNavigationKeyDown
event was removed. UsecellKeyDown
and check the key provided in the event argument. - The
columnHeaderNavigationKeyDown
event was removed. UsecolumnHeaderKeyDown
and check the key provided in the event argument. - The
GridCallbackDetails['api']
was removed from event details. Use theapiRef
returned byuseGridApiContext
oruseGridApiRef
instead.
Columns
- The
GridColDef['hide']
property was removed. UseGridColDef['columnVisibility']
instead.
Rows
- The
GridRowParams['getValue']
property was removed. Useparams.row
instead. - The
GridCellParams['getValue']
property was removed. Useparams.row
instead. - The
GridActionsCellProps['api']
property was removed. UseuseGridApiContext
hook instead to getapiRef
. - The
GridActionsCellProps['getValue']
property was removed. Useparams.row
instead. - The
GridFooterCellProps['getValue']
property was removed. Useparams.row
instead.
apiRef
methods
The
apiRef.current.updateColumn
method was removed. UseapiRef.current.updateColumns
instead.The
apiRef.current.getColumnsMeta
method was removed. UsegridColumnsTotalWidthSelector
orgridColumnPositionsSelector
selectors instead.The
apiRef.current.getRowIndex
method was removed. UseapiRef.current.getRowIndexRelativeToVisibleRows
instead.Some internal undocumented
apiRef
methods and properties were removed.If you don't use undocumented properties - you can skip the list below. Otherwise, please check the list and open an issue if there's something missing in the
apiRef
.List of removed undocumented methods and properties
getLogger
windowRef
unstable_caches
unstable_eventManager
unstable_requestPipeProcessorsApplication
unstable_registerPipeProcessor
unstable_registerPipeApplier
unstable_storeDetailPanelHeight
unstable_detailPanelHasAutoHeight
unstable_calculateColSpan
unstable_rowHasAutoHeight
unstable_getLastMeasuredRowIndex
unstable_getViewportPageSize
unstable_updateGridDimensionsRef
unstable_getRenderContext
unstable_registerStrategyProcessor
unstable_applyStrategyProcessor
unstable_getActiveStrategy
unstable_setStrategyAvailability
unstable_setCellEditingEditCellValue
unstable_getRowWithUpdatedValuesFromCellEditing
unstable_setRowEditingEditCellValue
unstable_getRowWithUpdatedValuesFromRowEditing
unstable_runPendingEditCellValueMutation
unstable_moveFocusToRelativeCell
unstable_updateControlState
unstable_registerControlState
Filtering
- The
GridFilterItem['columnField']
was renamed toGridFilterItem['field']
- The
GridFilterItem['operatorValue']
was renamed toGridFilterItem['operator']
- The
GridFilterItem['operator']
is now required.
Other exports
- The
useGridApi
hook was removed. UseapiRef.current
instead. - The
useGridState
hook was removed. UseapiRef.current.state
,apiRef.current.setState
andapiRef.current.forceUpdate
instead. - The
getGridColDef
utility function was removed. - The
GridValueGetterFullParams
type was removed. - The
GridSortModelParams
interface was removed. - The
GridApiRef
type was removed. UseReact.MutableRefObject<GridApi>
instead. - The
GridCellValue
type was removed. Useany
or theV
generic passed to most interfaces. - The
GridRowData
type was removed. UseGridRowModel
instead.