Question

我遇到了麻烦，我做了2个不同的过滤器一个过滤所选类别，另一个过滤日期选择器上的日期但我需要在这种情况下合而为一 1.-您只想按选择的类别进行过滤 2.-您只想按日期过滤 3.-您要按类别和选择的日期进行过滤

我按类别过滤的方式就是这样

filterData = (data) =>{
return data.filter((value,index)=>{
  if (this.state.filterSelected.indexOf(value.category)>-1) {
        return(value)
      }
})

}

和平板炉看起来像这样

<Griddle
data={this.state.filterSelected.length === 0  ? data : this.filterData(data)}
pageProperties={{
  pageSize: 100,
}}
plugins={[plugins.LocalPlugin]}
components={this.state.filterOptions}

/>

我按日期过滤的方式看起来像这样，它也起作用

 filterData = (data) =>{
  return data.filter((value,index)=>{
   if (this.state.dateSelected === value.time) {
      return(value)
    }
  })
}

和平板炉看起来像这样

    <Griddle
    data={this.state.dateSelected ==='' ? data : this.filterData(data)}
    pageProperties={{
      pageSize: 100,
    }}
    plugins={[plugins.LocalPlugin]}
    components={this.state.filterOptions}
  />

它们都是分开工作的，我知道它比任何我用来过滤数据的解决方案都更逻辑的问题但我不知道如何在英勇中传递勇气，我会有所帮助

  filterData = (data) =>{
    return data.filter((value,index)=>{
     if (
          (this.state.filterSelected.length>0 && 
          this.state.filterSelected.indexOf(value.category)>-1 && 
          this.state.dateSelected !='' && this.state.dateSelected(value.time)>-1)||
          (this.state.filterSelected.length==0 && 
          this.state.dateSelected !='' && this.state.dateSelected(value.time)) ||
          (this.state.filterSelected.length>0 && 
          this.state.filterSelected.indexOf(value.category) && 
          this.state.dateSelected =='')
         ){
        return(value)
      }
    })
  }

Answer 1

在渲染器中设置一个等于所有数据的变量，然后添加两个过滤器。例如：

render() {
  let filteredData = data;
  if (filterByDate) filteredData = this.filterByCategory(filteredData);
  if (filterByCategory) filteredData = this.filterByCategory(filteredData);

  return (
    <Griddle
      data={filteredData.length === 0 ? data : filteredData}
      pageProperties={{
        pageSize: 100,
      }}
      plugins={[plugins.LocalPlugin]}
      components={this.state.filterOptions}
    />
  );
}

在reactjs上合二为一的过滤器

1 个答案: