Question

选中一个复选框时，我正在向数组添加多个ID。

<input type="checkbox" name="vehicle2" onClick={() => this.addEvcGroupToArray(item.stations.map((item, key) => { return (item.stationID) }))}

这是将ID添加到数组的功能

     addEvcGroupToArray(id) {
        console.log("group_id ",id);
        var stationId = {};
        id.map((item, key) => {
            stationId = {
                stationId: item
            }
        })
        var evcGroupIdArray = this.state.stationIdArray.concat(stationId);
        this.setState({ stationIdArray: evcGroupIdArray })
    }

例如console.log("group_id ",id);输出一个["8"]这样的ID数组（这里只是一个ID，但是可以是任意数量的ID）。如果用户再次单击复选框，我想防止添加相同的ID。

我使用Set进行了类似的尝试。但这没有用。我该怎么办？

  addEvcGroupToArray(id) {
    console.log("group_id ",id);
    var stationId = {};
    id.map((item, key) => {
        stationId = {
            stationId: item
        }
    })
    var evcGroupIdArray = this.state.stationIdArray.concat(stationId);
    var uniqueArray = [...new Set(evcGroupIdArray)];
    this.setState({ stationIdArray: uniqueArray })
}

Answer 1

首先初始化一个数组，而不是像这样的对象

let stationId = [];

尝试添加此内容而不是添加id.map

id.forEach(item => {
  if (!this.state.stationIdArray.some(item => item === id)) {
   stationId.push(item);
 } 
})

并设置状态

this.setState({ stationIdArray: [...stationIdArray, stationId] });

希望对您有帮助。

Answer 2

map已经返回一个数组，尽管可以这样做，但不建议使用它遍历值。

const myArr = [
  {stationId: 3},
  {stationId: 1},
  {stationId: 2},
  {stationId: 3},
  {stationId: 3},
];


const result = [];
const map = new Map();
for (const item of myArr) {
if(!map.has(item.stationId)){
    map.set(item.stationId, true);    // set any value to Map
    result.push({
        stationId: item.stationId
    });
}
}
console.log(result)

Answer 3

lodash _.uniqueBy可以应用于evcGroupIdArray。

_.uniqBy(evcGroupIdArray, 'stationId');

Answer 4

在进入逻辑其余部分之前，尝试清洁id数组

function foo() {
  return new Promise((resolve, reject) => {
    document.getElementById('ok').addEventListener('click', resolve)
    document.getElementById('cancel').addEventListener('click', reject)
  })
}

Answer 5

怎么样？

function addEvcGroupToArray(id) {
    console.log("group_id ",id);
    // Get the current state id array
    const { stationIdArray } = this.state;
    // Append new id array
    const uniqueArray = [...new Set([...stationIdArray, ...id])];
    this.setState({ stationIdArray: uniqueArray })
}

从数组中删除重复的值

5 个答案: