react-data-grid-temp
Advanced tools
Changelog
v7.0.0-canary.18
Changelog
v7.0.0-canary.17
alpha
to canary
className
style
onRowsChange
onFill
onPaste
onSelectedCellChange
onCellSelected
and onCellDeSelected
propsenableFilterRow
enableHeaderFilters
and column.filterable
propsfilters
onFiltersChange
rows
rowGetter
and rowsCount
propsrowClass
defaultColumnOptions
minColumnWidth
and defaultFormatter
propsgroupBy
rowGrouper
column.cellClass(row)
function support:
column = { ..., cellClass(row) { return string; } }
column.minWidth
column.maxWidth
column.headerCellClass
column.editor
column.editorOptions
column.groupFormatter
scrollToRow
method
scrollToRowIndex
proprdg-light
or rdg-dark
class names.react-data-grid-addons
width
height
cellContentRenderer
contextMenu
enableCellSelect
enableCellAutoFocus
getValidFilterValues
onCellCopyPaste
onSelectedCellRangeChange
onCheckCellIsEditable
column.editable
instead.onGridKeyDown
onGridKeyUp
onRowDoubleClick
onRowsUpdate
onRowsChange
, onFill
, and onPaste
instead.onHeaderDrop
draggableHeaderCell
rowGroupRenderer
onRowExpandToggle
rowsContainer
getSubRowDetails
, onCellExpand
, onDeleteSubRow
, and onAddSubRow
cellMetaData
(from Row
and Cell
props)value
(from column.formatter
props)openCellEditor
, use selectCell
instead.const column = {
key: 'example',
name: 'Example',
- formatter: <CustomFormatter length={5} />
+ formatter: (props) => <CustomFormatter {...props} length={5} />
};
column.events
column.getCellActions
column.getRowMetaData
column.minColumnWidth
column.filterable
column.draggable
cellRangeSelection.{onStart,onUpdate,onEnd}
fromRowId
, toRowId
, and fromRowData
from onRowsUpdate
argumentHeaderCell
minHeight
to height
minWidth
to width
onGridSort
to onSort
emptyRowsView
to emptyRowsRenderer
rowKey
to rowKeyGetter
rowData
to row
fromRowData
to fromRow
idx
to rowIdx
in Row
renderer@babel/preset-env
with core-js
is recommended to enable compatibility for the browsers your project aims to support.summaryRows
types are now independent from rows
column.summaryCellClass
and column.summaryFormatter
propscolumn.formatter
isn't used anymore to render summary row cells.rowKeyGetter
prop is now required for row selection.column.cellClass
does not affect header cells anymore.onScroll
will directly pass the UIEvent rather than the scrollLeft and scrollRight only.main
to alpha
column.cellContentRenderer
summaryRows
prop #1773sortColumn
and sortDirection
props
selectedRows
and onSelectedRowsChange
props
SelectColumn
is now available to import and add a row selection column.react-data-grid-examples
npm install
+ npm start
onCellsDragged
onDragHandleDoubleClick
onRows
onRowUpdated
rowScrollTimeout
toolbar
isScrolling
(from column.formatter
props)ContainerEditorWrapper
EditorBase
setScrollLeft
from Row
and Cell
renderers
setScrollLeft
instance method was previously required on custom Cell and Row renderers and it can be safely removed now.ReactDataGrid
to DataGrid
react-data-grid/dist/react-data-grid.css
react-data-grid-addons
has no default export anymore
import * as DataGridAddons from 'react-data-grid-addons';
insteadreact-data-grid-addons/dist/react-data-grid-addons.css
AutoComplete
editorUtils