cara apa yang lebih disukai untuk mengubah status React?

Katakanlah saya memiliki daftar objek polos this.state.listyang kemudian dapat saya gunakan untuk membuat daftar anak-anak. Lalu bagaimana cara yang benar untuk memasukkan objek this.state.list?

Di bawah ini adalah satu-satunya cara yang menurut saya akan berhasil karena Anda tidak dapat memutasi this.statesecara langsung seperti yang disebutkan dalam dokumen.

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

Ini tampak jelek bagi saya. Apakah ada cara yang lebih baik?

concat mengembalikan array baru, jadi Anda bisa melakukannya

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

alternatif lain adalah pembantu keabadian React

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

  this.setState(newState);

setState () bisa dipanggil dengan fungsi sebagai parameter:

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

atau di ES5:

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

Perbarui 2016

Dengan ES6 Anda dapat menggunakan:

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

Dari dokumen react ( https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous ):

Karena this.props dan this.state dapat diperbarui secara asinkron, Anda tidak boleh mengandalkan nilainya untuk menghitung status selanjutnya.

Jadi Anda harus melakukan ini sebagai gantinya:

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