210312 TIL ag-grid Custom Tooltip, 그리고 버젼..

Mar 12, 2021 » 1.5막, TIL (Today I Learned), ag-grid

커스텀 툴팁을 예전부터 하고 싶었는데, 문서대로 해도 계속 에러가 났었다. addCssClass 관련 에러였는데… 이거 해결하면 또 다른 문제가 생기고 계속 연달아 문제가 생겼다. 그래서 뭐지 도대체....? 몇 일을 고민했는데… 혹시.. 설마? 하고 버젼을 올려봤는데, 허무하게 잘 되어버렸다. ^ㅇㅇ^

ag-grid-community                    ^23.2.1  →   ^25.1.0     
ag-grid-react                        ^22.0.0  →   ^25.1.0     

25.1로 업데이트 했더니 잘 되었다. (~~하는 김에 outdated 된 라이브러리 통째로 업데이트 했다가 웹팩 설정 난리나고 바벨 폭발하고 난리난리 나서 나머지는 다시 되돌린건 비밀…~~)

 if (툴팁적용할컬럼) {
    columnInfo.tooltipField = 컬럼명;
    columnInfo.tooltipComponent = 'customTooltip';
  }

  <AgGridReact
    ...
    tooltipShowDelay={1}
    frameworkComponents=
  />

  //customtooltip.jsx
  import React, { forwardRef, useEffect, useImperativeHandle } from 'react';

  export default forwardRef((props, ref) => {
    useImperativeHandle(ref, () => {
      return {
        getReactContainerClasses() {
          return ['custom-tooltip'];
        },
      };
    });

    return (
      <div className="custom-tooltip">
        <p>{props.value}</p>
      </div>
    );
  });