React-Virtualized с использованием cellmeasurer с максимальной шириной?

Question

Есть ли способ использовать реагировать на виртуализацию CellMeasurer с максимальной шириной столбца, который затем увеличил высоту?

Например, у меня может быть поле id в первом столбце сетки. Это никогда не станет слишком большим, но я хочу определить его размер на основе наибольшего значения. Затем во втором столбце у меня есть текстовое поле, которое я не очень уверен, насколько оно будет большим. Если окажется, что у всего моего текущего набора данных есть небольшое значение во втором столбце, я бы хотел, чтобы размер основывался на наибольшем значении. Если в нем есть какой-то более крупный текст (с определенной шириной), я бы хотел использовать эту максимальную ширину, а затем увеличить высоту строки, чтобы разместить текст строк.

Из того, что я вижу в документах и ​​коде, этот тип функций не поддерживается. Если это так, я думаю, что мой лучший метод будет реализовывать мой собственный CellMeasurer с немного более сложным _measure функция. Похоже ли это на правильный курс действий?

Answer 1

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

React может также заморозить объект стиля, поэтому используйте распространение, а не прямое изменение:

style={{
  ...style,
 maxWidth: 300
}}