为什么我的过滤器没有按预期工作？

Question

我有一组从数据库中提取的 Gym Classes，这是它的日志：

当它被拉出时，它们会被放入两个不同的数组中：

gymClasses: [],
filteredClasses: [],

然后，当用户单击其中一个下拉列表时，它会使用 this.filterClasses(event.target.value); 获取所选下拉列表的值

然后运行这个的函数：

filterClasses(value) {
  const newFilteredClasses = this.state.gymClasses.filter( (value) => {
    return this.state.gymClasses.type === value;
  });

  this.setState({filterClasses: newFilteredClasses});
  console.log('values ', this.state.filteredClasses);
}

当我打开最后一个应该显示filteredClasses 的console.log 时，它显示的类与未过滤的类相同。

这是上次的结果

console.log('values ', this.state.filteredClasses);

任何帮助建议将不胜感激！

Answer 1

在过滤器回调中，您正在检查

的类型

this.state.gymClasses.type === value

理想情况下，您应该使用回调param 而不是this.state.gymClasses.type

试试这个

filterClasses(selectedValue) {
  const newFilteredClasses = this.state.gymClasses.filter( (value) => {
    return value.type === selectedValue;
  });

  this.setState({filterClasses: newFilteredClasses});
}