cách ưa thích để thay đổi trạng thái React là gì?

Giả sử tôi có một danh sách các đối tượng thuần túy this.state.listmà tôi có thể sử dụng để hiển thị danh sách các đối tượng con. Vậy thì cách thích hợp để chèn đối tượng vào là this.state.listgì?

Dưới đây là cách duy nhất tôi nghĩ rằng nó sẽ hoạt động vì bạn không thể thay đổi this.statetrực tiếp như đã đề cập trong tài liệu.

this._list.push(newObject):
this.setState({list: this._list});

Điều này có vẻ xấu với tôi. Có cách nào tốt hơn?

concat trả về một mảng mới, vì vậy bạn có thể làm

this.setState({list: this.state.list.concat([newObject])});

một giải pháp thay thế khác là trình trợ giúp bất biến của React

  var newState = React.addons.update(this.state, {
      list : {
        $push : [newObject]
      }
  });

  this.setState(newState);

setState () có thể được gọi với một hàm dưới dạng tham số:

this.setState((state) => ({ list: state.list.concat(newObj) }))

hoặc trong ES5:

this.setState(function(state) {
  return {
   list: state.list.concat(newObj)
  }
})

Cập nhật 2016

Với ES6, bạn có thể sử dụng:

this.setState({ list: [...this.state.list, ...newObject] });

Từ tài liệu phản ứng ( https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous ):

Vì this.props và this.state có thể được cập nhật không đồng bộ, bạn không nên dựa vào giá trị của chúng để tính toán trạng thái tiếp theo.

Vì vậy, bạn nên làm điều này thay thế:

this.setState((prevState) => ({
  contacts: prevState.contacts.concat([contact])
}));