发布于 2020-12-09 16:47
共1个回答
UJ
游客uJLTPs

你可以通过cellRenderer 设置一个自定义的类名让他看起来是被选择的行。

  public render(): React.ReactElement<{}> {
    return (
      <div style={{ display: "flex", flexDirection: "column" }}>
        <div className="example-button" onClick={this.onClickUp}>
          Move Up
        </div>
        <MultiGrid
          cellRenderer={this.renderGridCell}
          className="example-grid"
          columnCount={4}
          columnWidth={100}
          height={100}
          rowHeight={25}
          rowCount={rowCount}
          scrollToRow={this.state.row}
          width={415}
        />
        <div className="example-button" onClick={this.onClickDown}>
          Move Down
        </div>
      </div>
    );
  }


private renderGridCell = (props: GridCellProps): React.ReactNode => { return ( <div className={`example-grid-cell${ this.state.row === props.rowIndex ? " example-grid-cell-selected" : "" }`} style={props.style} > {props.columnIndex},{props.rowIndex} </div> ); };

参见:https://codesandbox.io/s/n4qorzj4km

回答问题