您可以通过forwardRef将<CategoryColumn/>引用传递给父组件，并通过<CategoryColumn/>内部的useImperativeHandle函数参数访问父模型的值。

• • 示例**

CategoryColumn

import React, {
  Fragment,
  forwardRef,
  useImperativeHandle,
  useRef,
} from 'react';
import { IFloatingFilterParams } from 'ag-grid-community';

export default forwardRef((props: IFloatingFilterParams<any>, ref) => {
  const inputRef = useRef<HTMLInputElement>(null);

  // expose AG Grid Filter Lifecycle callbacks
  useImperativeHandle(ref, () => {
    return {
      onParentModelChanged(parentModel: number | null) {
        console.log(parentModel)
        // When the filter is empty we will receive a null value here
        if (parentModel == null) {
          inputRef.current!.value = '';
        } else {
          inputRef.current!.value = parentModel + '';
        }
      },
    };
  });

  return (
    <Fragment>
      &gt;{' '}
      <input
        ref={inputRef}
        style={{ width: '30px' }}
        type="number"
        min="0"
      />
    </Fragment>
  );
});

index.tsx

... 

  const [columnDefs, setColumnDefs] = useState<ColDef[]>([
    { field: 'athlete', filter: 'agTextColumnFilter' },
    {
      field: 'gold',
      floatingFilterComponent: NumberFloatingFilterComponent,
      floatingFilterComponentParams: {
        suppressFilterButton: true,
      },
      filter: NumberFilterComponent,
    },
  ]);

  const defaultColDef = useMemo<ColDef>(() => {
    return {
      filter: true,
      floatingFilter: true,
    };
  }, []);
...

读过银栅浮动过滤器!