react：如何过滤道具中的对象数组

Question

我有props以下数据

test1: abc
id: 1
myArray: Array(3)
0: {a:abc, b:cde, aid: 1}
1: {e:age, f:ade, aid: 2}
2: {t:are, h:had, aid: 1}

我想过滤道具并更新数组，使其只包含与id和aid匹配的值

所以道具应该如下所示：

test1: abc
id: 1
myArray: Array(3)
0: {a:abc, b:cde, aid: 1}
2: {t:are, h:had, aid: 1}

我该怎么做？

Answer 1

您可以使用filter数组方法

let myArray = [{a:"abc", b:"cde", aid: 1},
               {e:"age", f:"ade", aid: 2},
               {t:"are", h:"had", aid: 1}]

const result = myArray.filter(item => item.aid === 1)

console.log(result)

但请注意道具不可变。

如果您希望永久更改此prop，则必须update it in the parent component。

Answer 2

您可以使用Array.filter()

// match both a AND aid
const result = myArray.filter(obj => (obj.a === test1 && obj.aid === id);
// match either a OR aid
const result = myArray.filter(obj => (obj.a === test1 || obj.aid === id);

Answer 3

您将使用

获取过滤后的数据

const filteredData = this.props.myArray.filter(item => item.aid === 1)

但道具只是可读的。您将不得不调度或更新父组件以提供新的/过滤的数据作为道具。