在VUE中一个对象数组通过对象中的一个属性判断多个对象是否在另一个数组中,如果存在则从另一个数组移除
时间: 2024-09-20 22:06:39 浏览: 64
Vue 2.0学习笔记之Vue中的computed属性
在Vue中,如果你有一个对象数组`arr1`,并且你想基于每个对象的某个属性(例如`id`)检查这个对象是否存在于另一个数组`arr2`中,你可以使用`Array.prototype.find()`方法结合`filter()`方法来达到目的。首先,遍历`arr1`,对于每个对象,找到`arr2`中与之匹配的项:
```javascript
let arr1 = [
{ id: 'item1', otherData: 'data1' },
{ id: 'item2', otherData: 'data2' }
];
let arr2 = [
{ id: 'item1', data: 'someValue' },
// ... 其他元素
];
// 创建一个新数组,仅包含在arr2中存在的对象
let filteredArr1 = arr1.filter(obj => {
return !arr2.find(item => item.id === obj.id);
});
// 如果需要删除arr2中的相应项,可以这样做
filteredArr1.forEach(obj => {
arr2 = arr2.filter(item => item.id !== obj.id);
});
console.log(filteredArr1); // 包含不在arr2中存在的对象
console.log(arr2); // 包含移除后的arr2
```
在这个例子中,`find()`方法用于查找`arr2`中与`obj.id`匹配的第一个对象,如果找不到,则返回`undefined`。`filter()`方法会过滤出所有找不到对应项的对象。
阅读全文