如何将新的子键值添加到 React State 对象

Question

我想添加一个新的子键值到现有的 partent -happening on React。假设这是我的状态：

this.state = {
  genres: {
    Rock: '',
    Jazz: '',
    Pop: ''
  }
}

这是我的方法：

addingGenre(tw) {
  this.setState({
    genres: { [tw]: '', }
    })
}

这显然是行不通的，它覆盖了我的完整状态 --> {genres: tw}。

提前致谢:)

Answer 1

您需要推送到当前状态。所以它应该是这样的：

addingGenre(tw) {
  this.setState({
    genres: { ...this.state.genres, [tw: '']}
    })
}

Answer 2

你可以这样做 -

addingGenre(tw) {
  const state = this.state; 
  state.genres[tw] = ''; 
  this.setState(state)
}