您如何制作具有特殊字符的自定义过滤器？

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，并返回三月份订购的所有产品，但是一旦输入斜线，就不会显示任何结果。如果我搜索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)));