我正在使用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>
);
}
}
网格没有过滤器,看起来像这样:
如何获取打开过滤器以显示的过滤器图标?
答案 0 :(得分:1)
我解决了这个问题,为了使过滤器出现,我必须设置网格选项enableFilter: true
。我不知道这一点,因为它在文档中从未提到过。
答案 1 :(得分:-1)
在 gridOptions 中设置 enableFilter: true