Kendo React Grid：如何自定义专用于日期的列菜单过滤器及其过滤

Question

我有一个包含几列的组件。其中之一是日期列。现在，我想从列菜单过滤器中过滤该列，但我无法对其进行自定义。我希望过滤器根据我的语言环境具有自定义格式，例如 MM/dd/yy 或 dd/MM/yy（占位符和值）。谁能指导我如何做到这一点？由于通用列过滤器菜单给我 month/day/year （占位符）和相同的日期格式。在这里发布一些代码。

Component.jsx

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

<Grid useColumnFilterMenu>
    <Column
        field="joinDate"
        title={locale('joinDateTitle')}
        format={`{0:${locale('joinDateFormat')}}`}
        filter="date"
        columnMenu={props => {
            <GridColumnMenuFilter {...props} />
        }
     />
....
....
</Grid>

此处，joinDateFormat - 是 MM/dd/yy 或 dd/MM/yy 格式。这向我展示了 API 调用的结果非常好。但是根据我的语言环境更改，我正在努力处理列过滤器及其占位符和日期格式。

任何帮助都会很棒。 TIA.

Answer 1

我们可以使用 GridColumnMenuFilter 的 filterUI 道具来实现这一点。

Answer 2

如果只是格式问题，并且您希望它与您的语言环境相匹配，您可以使用 Kendo IntlProvider：https://www.telerik.com/kendo-react-ui/components/intl/i18n/

Kendo React Grid：如何自定义专用于日期的列菜单过滤器及其过滤

Kendo React Grid: How to customize the column menu filter specifically for date and its filtering

kendo-ui

kendo-grid

reactjs

kendo-react-ui