首页 > 解决方案 > React Kendo Grid:删除重复的过滤器

问题描述

我们有一个简单的只读 React 网格,每一列都有标准的 Kendo 过滤器。虽然我们不想要重复的过滤器。

网格代码

                        sortable
                        pageable={this.state.pageable}                      
                        data={this.state.queuedData}
                        sort={this.state.sort}
                        filter={this.state.filter}
                        onFilterChange={this.handleFilterChange}
                        onSortChange={this.handleSortChange}
                        onPageChange={this.handlePageChange}
                        total={this.state.total}
                        skip={this.state.skip}
                        pageSize={this.state.pageSize}                       
                        resizable>                   
                    <GridColumn field="entity" title="Entity" sortable={true} columnMenu = {ColumnMenu}/>
                    <GridColumn field="name" title="Name"  sortable={true} columnMenu = {ColumnMenu}/>
                    <GridColumn filter="date" field="changedDate" title="Change Date"  sortable={true} 
                    columnMenu = {ColumnMenu}
                    cell={this.CustomCell}/>

ColumnMenu 组件代码

import React from 'react';
import {
    GridColumnMenuFilter
} from '@progress/kendo-react-grid';

export class ColumnMenu extends React.Component {
    render() {
        return (
            <div>
                <GridColumnMenuFilter {...this.props} expanded={true}/>
            </div>
        );
    }
}

结果是这样的:

在此处输入图像描述

但我们想要这样的东西:

在此处输入图像描述

请建议如何可能

标签: cssreactjskendo-uikendo-gridkendo-react-ui

解决方案


<GridColumnMenuFilter {...this.props} hideSecondFilter 展开={true}/>


推荐阅读