React - 过滤器数组获取所有消息

Question

我正在尝试制作一个 React 过滤器来过滤每个人的消息。但我没有想法试图得到正确的结果....

0: {first_name: "dk", last_name: "k", email: "k@l.nl", message: "Email Sent", name: "test camp"}
1: {first_name: "asdfk", last_name: "lksdfl", email: "kk@l.nl", message: "Email Sent", name: "test camp"}
2: {first_name: "asdfkl", last_name: "lksdf", email: "salkdf@live.nl", message: "Email Sent", name: "test camp"}
3: {first_name: "asdklfjlk", last_name: "laskdfjlksdf", email: "ksdfsdaf@l.nl", message: "Email Sent", name: "test camp"}
4: {first_name: "asdfkl", last_name: "lksdjfkl", email: "kk@sds.nl", message: "Email Sent", name: "test camp"}
5: {first_name: "asdfkl", last_name: "lksdjfkl", email: "kk@sds.nl", message: "Clicked Link", name: "test camp"}

我想要实现的是获得每个用户的消息列表。对于用户“asdfkl”，它将是消息 [已发送电子邮件，单击链接]。

任何想法如何在反应中实现这一目标？

提前致谢

Answer 1

您可以使用 reduce 尝试更好的方法：

const people = [
  {
    first_name: 'dk',
    last_name: 'k',
    email: 'k@l.nl',
    message: 'Email Sent',
    name: 'test camp'
  },
  {
    first_name: 'asdfk',
    last_name: 'lksdfl',
    email: 'kk@l.nl',
    message: 'Email Sent',
    name: 'test camp'
  },
  {
    first_name: 'asdfkl',
    last_name: 'lksdf',
    email: 'salkdf@live.nl',
    message: 'Email Sent',
    name: 'test camp'
  },
  {
    first_name: 'asdklfjlk',
    last_name: 'laskdfjlksdf',
    email: 'ksdfsdaf@l.nl',
    message: 'Email Sent',
    name: 'test camp'
  },
  {
    first_name: 'asdfkl',
    last_name: 'lksdjfkl',
    email: 'kk@sds.nl',
    message: 'Email Sent',
    name: 'test camp'
  },
  {
    first_name: 'asdfkl',
    last_name: 'lksdjfkl',
    email: 'kk@sds.nl',
    message: 'Clicked Link',
    name: 'test camp'
  }
];

const getEmails = people.reduce((acc, cur) => {
  const user = cur.first_name;
  if (!acc[user]) {
    acc[user] = [];
  }
  acc[user] = [...acc[user], cur];
  return acc;
}, {});

console.log(getEmails);

Answer 2

这是一个通过first_name 过滤您的集合的示例：

const people = [ { first_name: 'dk', last_name: 'k', email: 'k@l.nl', message: 'Email Sent', name: 'test camp' }, { first_name: 'asdfk', last_name: 'lksdfl', email: 'kk@l.nl', message: 'Email Sent', name: 'test camp' }, { first_name: 'asdfkl', last_name: 'lksdf', email: 'salkdf@live.nl', message: 'Email Sent', name: 'test camp' }, { first_name: 'asdklfjlk', last_name: 'laskdfjlksdf', email: 'ksdfsdaf@l.nl', message: 'Email Sent', name: 'test camp' }, { first_name: 'asdfkl', last_name: 'lksdjfkl', email: 'kk@sds.nl', message: 'Email Sent', name: 'test camp' }, { first_name: 'asdfkl', last_name: 'lksdjfkl', email: 'kk@sds.nl', message: 'Clicked Link', name: 'test camp' } ]; 

let getMessagesByFirstName = (name, data) => {
  let result = data.filter(x => x.first_name.includes(name)) || []
  if(result.length) {
    result = Array.from(result.reduce((r,{message}) => r.add(message), new Set()))
  }
  return result
}

console.log(getMessagesByFirstName('asdfkl', people))

并以数组形式获取所有他的消息。

想法是先通过Array.filter进行过滤，然后将返回的数据集减少到只有Array.reduce的消息。 使用 Set 只是为了让我们获得唯一值并且在最终数组中没有重复。

Answer 3

const filteredMessagesList = name => {
    const messagesArray = [];
    personList.forEach(person => {
        if(person.name === name) {
            messagesArray.push(person.message);
        }
    });
    return messagesArray;
}