javascript - 更新对象属性中的数组

Question

我有一个这样定义的对象:

import React, { Component } from 'react';
import './App.css';

class App extends Component {

  constructor() {
    super();
    this.state = {
    lists: ["Dogs", "Cats"],
    items: {Dogs:[], Cats:[]}
    };
  }

  handleAddItem(item) {
    console.log(this.props.idName);
    console.log(item);
  }

我有变量

console.log(this.props.idName)// output: Dogs
console.log(item);// output {name: "lofi"}  

我不知道如何更新对象项{}以使其变成这样:

items{Dogs:[{name: "lofi"}], Cats:[]}

Answer 1

要更新嵌套的 Array 子状态，可以使用扩展运算符追加元素

handleAddItem = item => {
  this.setState((prevState, props) => ({
    items: {
      ...prevState.items,
      [props.idName]: [
        ...prevState.items[props.idName],
        item
      ]
    }
  }))
}