Question

我创建了一个示例代码来演示我的问题，实际数据要大得多

const arr = [{
  id: 1
}, {
  id: 2,
  items: [{
    id: 1
  }]
}]

const target = 2
const nextIndex = 1
newArr = arr.map(o => o.id === target ? ({
  ...o,
  items: [...o.items, {
    id: 'new id'
  }]
}) : o);

console.log(newArr);

如何通过索引插入{id：'new id'}？上面的代码被追加到items数组上。假设我有一个click事件，用户可以按索引插入{id：'new id}的位置，我不能使用append，因为它不会替换现有对象。

预期产量

[{
  id: 1
}, {
  id: 2,
  items: [{
    id: 1
  },{
   id: 'something'
}]

以上代码不起作用，不使用索引将新项目添加到项目数组。

Answer 1

The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements

const target = 2;
int index = arr.findIndex(v => v.id == target);
if (index > -1) {
  arr.splice(index, 1, {id: 'new id'}); // replace 1 with 0 if you just want to insert.
}

Answer 2

尝试通过onClick事件传递索引

functionName = (i) => { //where i is index from onclick event

 arr.map( o, index) => {

  if(i === index)

  {
    const obj = {      //object
     id: 'new id'
    }
    arr[i].push(obj)   // push object at given index from onClick
  }

 }

}

在对象的嵌套数组中按索引追加数组

2 个答案: