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

时间:2019-05-13 19:32:34

标签: arrays reactjs filter

我正在尝试制作一个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”,它将是消息[发送电子邮件,单击链接]。

有任何想法如何实现这一目标吗?

预先感谢

3 个答案:

答案 0 :(得分:3)

您可以尝试使用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);

答案 1 :(得分: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只是为了使我们获得唯一的值,并且在最终数组中没有重复项。

答案 2 :(得分:0)

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