你如何做一个带有特殊字符的自定义过滤器？

Question

我正在使用 react bootstrap 表，并且有一个名为 Order Date 的列。我想要一个过滤器，用户可以输入日期（例如：03/2019）来获取 2019 年 3 月订购的所有产品。 所以我的列定义如下所示：

 dataField: 'orderDate',
 text: 'Order Date',
 sort: true,
 headerStyle: {fontSize: '12px', whiteSpace:'nowrap'},
 filter: textFilter({placeholder:'mm/yyyy'})

在“/”之前效果很好。我可以搜索 03，并返回 3 月份订购的所有产品，但是我一输入斜线，就没有呈现任何结果。如果我搜索 032019，它也不会返回任何内容。

我尝试了 dateFilter，但我不希望用户必须滚动浏览日历。他们喜欢 textFilter 般的简单性。

有没有办法让斜线起作用？

Answer 1

您可以创建一个正则表达式模式然后进行过滤。

    const pattern = new RegExp('11/2012', 'gi');

    const dates = ['02/2010', '10/2011', '11/2012'];
    
    console.log(dates.filter(date => pattern.test(date)));