使用自定义 cellRenderer 时，Ag Grid autoHeight 和 wrapText 不起作用

Question

我正在尝试

wrap the text

冗长的单元格值。根据文档设置

autoHeight=true

和

wrapText=true

无需

cellRenderer

组件即可正常工作。但是当使用

cellRendererFramework

React component, seems not working

时。我尝试在自定义单元格渲染器中设置样式也不起作用。任何帮助将不胜感激！

AgGrid 组件如下，

<AgGridReact
    {...configs}
    onGridReady={onGridReady}
    masterDetail={true}
    suppressContextMenu
    detailCellRenderer='agCustomDetailTimelineRenderer'
    detailRowHeight={140}
    frameworkComponents={{
        agCustomRenderer: CustomRenderer,
    }}>
    {configs.columnDefs.map((columnDef) => (
        <AgGridColumn {...columnDef} />
    ))}
</AgGridReact>

默认列定义是，

defaultColDef: {
    sortable: true,
    filter: true,
    wrapText: true,
    autoHeight: true,
    menuTabs: ['filterMenuTab']
}

我的自定义 React 组件是，

import React from 'react';

const CustomRenderer = (props) => {
  return (
    <div
      style={{ height: '100%', whiteSpace: 'normal', wordBreak: 'break-all' }}>
      {props.value}
    </div>
  );
};

export default CustomRenderer;

Answer 1

对我来说，它在添加固定宽度时开始工作，在向 columnDef 添加以下三个属性之后，它开始为我工作

wrapText: true,
autoHeight: true,
width: 120