Hi. I am trying to add some extra class to the td which I use the Cell component and expend the className prop.
However, I cannot resolve the original behaviour on the following simple code:
cellRenderer={(props) => <Cell {...props} />}
A significant mis-behaviour is that the arrow key navigation failure.
After reading along the code, I figure out a possible reason:
In DataCell there is a onKeyUp prop passed to cellRenderer but there are not used in Cell
DataCell.js
return (
<CellRenderer
row={row}
col={col}
cell={cell}
selected={selected}
editing={editing}
updated={updated}
attributesRenderer={attributesRenderer}
className={className}
style={widthStyle(cell)}
onMouseDown={this.handleMouseDown}
onMouseOver={this.handleMouseOver}
onDoubleClick={this.handleDoubleClick}
onContextMenu={this.handleContextMenu}
onKeyUp={onKeyUp}
>
{content}
</CellRenderer>
);
Cell.js (missing onKeyUp)
return (
<td
className={className}
onMouseDown={onMouseDown}
onMouseOver={onMouseOver}
onDoubleClick={onDoubleClick}
onTouchEnd={onDoubleClick}
onContextMenu={onContextMenu}
colSpan={colSpan}
rowSpan={rowSpan}
style={style}
{...attributes}
>
{this.props.children}
</td>
);
Hi. I am trying to add some extra class to the td which I use the Cell component and expend the className prop.
However, I cannot resolve the original behaviour on the following simple code:
cellRenderer={(props) => <Cell {...props} />}A significant mis-behaviour is that the arrow key navigation failure.
After reading along the code, I figure out a possible reason:
In
DataCellthere is aonKeyUpprop passed to cellRenderer but there are not used inCellDataCell.js
Cell.js (missing
onKeyUp)