Ag-Grid фильтр не отображается, если не включен плавающий фильтр - PullRequest
0 голосов
/ 29 февраля 2020

Я строю сетку с ag-grid и реагирую. Я пытаюсь добавить текстовый фильтр в свою сетку, но фильтр не отображается в сетке. Если я включаю плавающий фильтр, он есть, но не регулярно.

Вот код

type Props = {
  gridData: Array<any>;
}

type State = {}

class filteredGrid extends PureComponent<Props, State> {
  private gridOptions = {};
  static propsType = {
    gridData: ImmutablePropTypes.list
  }
  constructor(props) {
    super(props);
    gridOptions = {
      defaultColDef: { filter: true },
      columnDefs: [
        { headerName: "Location", field: 'location', filter: "agTextColumnFilter" },
      ],
      suppressMenuHide: true,
      suppressMovableColumns: true,
      enableSorting: true,
      rowSelection: 'single',
      rowDeselection: true,
      onGridReady: debounce(function (params) {
        params.api.sizeColumnsToFit();
        window.addEventListener('resize', function () {
          setTimeout(function () {
            params.api.sizeColumnsToFit();
          });
        });
      }),
      pagination: true,
      paginationPageSize: 10,
      rowClass: 'grid-row',
      gridAutoHeight: true,
      headerHeight: 50,
      rowHeight: 50,
      overlayNoRowsTemplate: '<span>No Data</span>',
    };
  }

  render(): ReactNode {
    const { gridData } = this.props;
    return (
      <div>
        <div className="ag-theme-material">
          <AgGridReact
            gridOptions={this.gridOptions}
            rowData={gridData}
          />
        </div>
      </div>
    );
  }
}

Сетка не имеет фильтра и выглядит следующим образом:

Grid

Как я могу получить значок фильтра, который открывает фильтр, чтобы показать?

1 Ответ

0 голосов
/ 02 марта 2020

Я решил проблему, чтобы фильтры появились, мне нужно было установить параметр сетки enableFilter: true. Я не знал этого, поскольку это никогда не упоминалось в документации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...