如何使用特定键对数组进行本机反应

时间:2020-06-26 16:01:14

标签: javascript reactjs react-native

我有一个如下数组:

const data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
...
]

我想做的就是这个。假设我只想查看user1和user 2之间的对话。

所以我想过滤数组并创建一个新数组,该数组仅包含发件人为 user1 且收件人为 user2 或发件人为 user2的那些数据,接收者是 user1

我认为,可以使用地图或类似的东西来完成此操作,但我实际上不知道。我是React Native的新手。

5 个答案:

答案 0 :(得分:2)

let result = []

getSenderRec = (user1, user2) => {
    data.filter(data => {
        if (user1 === data.sender && user2 === data.receiver || user2 === data.sender && user1 === data.receiver){
                result.push(data)
            }
        }   
    )
}
const data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
]

getSenderRec('user1', 'user2')

console.log(result)

这是您的console.log(result)输出:

[ { id: '1', sender: 'user1', receiver: 'user2', msg: 'hello!' },
  { id: '2', sender: 'user2', receiver: 'user1', msg: 'yo!' } ]

答案 1 :(得分:2)

使用Array.filter。回调返回一个布尔值:

const data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
];

function filterData(data) {
    return data.filter((x) => (x.sender === 'user1' && x.receiver === 'user2') || (x.sender === 'user2' && x.receiver ===  'user2'));
}

const result = filterData(data);

答案 2 :(得分:1)

You need just use filter for array

const data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
]

const result = data.filter(rec => {
  if (rec.sender === 'user1' && rec.receiver === 'user2') {
    return rec
  }
  if (rec.sender === 'user2' && rec.receiver === 'user1') {
    return rec
  }
})

答案 3 :(得分:1)

您可以维护array中的users,并以此为基础对数组进行过滤:

var data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
];
var users=['user1', 'user2'];

var result = data.filter(chat=>users.includes(chat.sender) && users.includes(chat.receiver));

console.log(result);

或者,您也可以为对象keys维护一个过滤器数组。它将使代码更短。在这里:

var data = [
    {"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
    {"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
    {"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
    {"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
];

var users=['user1', 'user2'];
var filters=['sender', 'receiver'];

var result = data.filter(chat=>filters.every(k=>users.includes(chat[k])));
console.log(result);

答案 4 :(得分:1)

您需要像下面这样使用

 const data = [
{"id":"1", "sender":"user1", "receiver":"user2", "msg":"hello!"},
{"id":"2", "sender":"user2", "receiver":"user1", "msg":"yo!"},
{"id":"3", "sender":"user3", "receiver":"user1", "msg":"hi!!"},
{"id":"4", "sender":"user1", "receiver":"user3", "msg":"hmm"},
...
]

let filtereddata = data.filter((el)=>{
    return el.sender === "user1" && el.receiver === "user2"
    
})

在这里,filterddata只会显示您想要显示的结果