lineheight对于texttrap /autoHeight来说太大了

Question

我想在ag-grid中显示的数据主要是文本块。我希望文本为换行，单元格高度为auto.

wrapText: true,
autoHeight: true

然而，当文本换行时，它保持40px的行高，这并不吸引人。我还注意到它并没有尝试在一个单词上换行。

我尝试重置行高，但然后我失去了任何顶部或底部填充。当我添加填充时，顶部填充是好的，但底部填充是隐藏的-行高不考虑填充。

我如何得到一个有吸引力的块文本显示在一个适当的填充单元格内容的单元格?

Answer 1

您可以添加一些CSS来直接针对单元格内容添加填充:

.ag-theme-alpine .ag-cell-value {
line-height: 20px !important;
word-break: normal; /* prevent words from breaking */
padding-top: 5px; /* space top */
padding-bottom: 5px; /* space bottom */
}

参见下面的plunkr

Answer 2

我不确定如何修复单词换行，但是AG Grid提供了用于自定义行高样式的css选项。例如

.ag-theme-alpine.ag-custom {
--ag-grid-size: 3px;
--ag-list-item-height: 20px;
}

参见https://www.ag-grid.com/react-data-grid/global-style-customisation-compactness/获取更多信息。