Как изменить высоту HeaderCell в React-Data-Grid?

Question

Здесь - это базовая сетка в CodeSandbox.Когда я определяю свой объект columns, для одного из столбцов я передаю свойство headerRenderer как простой компонент React, показывающий некоторый текст и красный фон.Я сделал высоту 100 для этого компонента, чтобы он расширил ячейку заголовка.Это не сработало.

Я пошел в инструменты Chrome dev и попытался изменить несколько свойств css для различных родительских элементов, но безрезультатно: отображаемая высота заголовка всегда равна 35px.

Примечание в ссылкеЯ также определил override.css, который конкретно определяет высоту класса .react-grid-HeaderCell.

Чего мне не хватает, что высота этого заголовка не сдвинется с места?

Answer 1

Имя пропеллера headerRowHeight может использоваться для установки высоты ячейки заголовка.В вашем примере это будет как

<ReactDataGrid
          columns={columns}
          rowGetter={i => this.state.rows[i]}
          rowsCount={3}
          onGridRowsUpdated={this.onGridRowsUpdated}
          enableCellSelect={true}
          headerRowHeight={50}
        />