ReactJS如何获取某条数据的总条数？答案

【问题标题】：How to get the total number of a data with a specific value in ReactJS?ReactJS如何获取某条数据的总条数？
【发布时间】：2023-02-20 22:33:51
【问题描述】：

所以我创建了一个数据列表，我需要能够获得状态为“打开”的数据总数并将其显示在 console.log 中。

const approvals = [
  {
    id: 1,
    member: 'Charlie Lubin',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.57',
    status: 'Open',
    submittedOn: '-',
  },
  {
    id: 2,
    member: 'Madelyn Baptista',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.71',
    status: 'Open',
    submittedOn: '-',
  },
  {
    id: 3,
    member: 'Lincoln Arcand',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.42',
    status: 'Approved',
    submittedOn: '-',
  },
{
    id: 4,
    member: 'Ryan Botosh',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '-',
    activity: '-',
    status: 'Approved',
    submittedOn: '-',
  },
  {
    id: 5,
    member: 'Craig Workman',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.65',
    status: 'Approved',
    submittedOn: '-',
  },
];

【问题讨论】：

标签： javascript reactjs arrays

【解决方案1】：

const approvals = [
  {
    id: 1,
    member: 'Charlie Lubin',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.57',
    status: 'Open',
    submittedOn: '-',
  },
  {
    id: 2,
    member: 'Madelyn Baptista',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.71',
    status: 'Open',
    submittedOn: '-',
  },
  {
    id: 3,
    member: 'Lincoln Arcand',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.42',
    status: 'Approved',
    submittedOn: '-',
  },
{
    id: 4,
    member: 'Ryan Botosh',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '-',
    activity: '-',
    status: 'Approved',
    submittedOn: '-',
  },
  {
    id: 5,
    member: 'Craig Workman',
    payPeriod: 'Sun, Jan 15, 2023 - Sat, Jan 21, 2023',
    duration: '45:11:36',
    activity: '0.65',
    status: 'Approved',
    submittedOn: '-',
  },
];

console.log(approvals.filter(a => a.status === 'Open').length)

【讨论】：

【解决方案2】：

使用 filter 方法，您可以过滤列表以返回仅包含通过指定检查的成员的新列表。

console.log(approvals.filter((approval)=> approval.status === 'Open'))

【讨论】：