如何按多个条件过滤数组但保持其当前状态？

Non 发表于 Dev

非

我正在尝试使用过滤器功能，其中我有 4 个不同的过滤器，我需要选择组合它们。

这是数据样本：

[
  {
    uniqueId: 23,
    status: false,
    employeeRole: true,
  },
  {
    uniqueId: 35,
    status: true,
    employeeRole: true,
  },
  {
    uniqueId: 9,
    status: true,
    employeeRole: false,
  }
]

过滤器是：如果状态false === 'inactive'|| true === 'active'和员工true === 'APA'角色相同|| false === 'employee'.

过滤器仅在一种情况下起作用。如果我只想按status或仅按employeeRole它进行过滤，但如果我想要两个过滤器，则其中一个过滤器接管另一个。

handleTableFilters = dataArray => {
    const { isActive, isAPA, isInactive, isEmployee } = this.props;

    const newArr = dataArray
      ? dataArray.filter(item => {
          if (isActive || isAPA || isInactive || isEmployee) {
            return (
              (isActive === true && item.statusDetail === true) ||
              (isInactive === true && item.statusDetail === false) ||
              (isAPA === true && item.employeeRole === true) ||
              (isEmployee === true && item.employeeRole === false)
            );
          }

          return item;
        })
      : [];

    return newArr;
};

这 4 个道具isActive, isAPA, isInactive, isEmployee只是标志，就像在复选框中一样，如果我选中status过滤器的复选框，那么它会设置isActive = true.

这是它不起作用的一种情况：1 - 将过滤器设置为仅显示status === true（它仅status true按预期显示）。

2 - 还设置过滤器显示employeeRole === true（它显示所有employeeRole === true忽略状态过滤器设置为显示status === true）。

所以在这个场景中，过滤器应该一起工作。只有status === true+ employeeRole == true。

梅迪特·特鲁卡比鲁利

不要写这样的代码，修复起来很烦，不可读，分开吧

handleTableFilters = dataArray => {
    const { isActive, isAPA, isInactive, isEmployee } = this.props;

    const activeFilter = item => item.statusDetail === isActive
    const APAFilter = item => item.employeeRole === isAPA


    return dataArray.filter(activeFilter).filter(APAFilter)
};

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。