Angenommen, ich habe eine Liste mit einfachen Objekten in meinem this.state.list
, mit denen ich dann eine Liste mit untergeordneten Objekten rendern kann. Was ist dann der richtige Weg, um ein Objekt einzufügen this.state.list
?
Im Folgenden ist der einzige Weg, wie ich denke, dass es funktionieren wird, da Sie das nicht this.state
direkt mutieren können, wie im Dokument erwähnt.
this._list.push(newObject):
this.setState({list: this._list});
Das scheint mir hässlich. Gibt es einen besseren Weg?
javascript
reactjs
Khoi
quelle
quelle
Antworten:
concat
Gibt ein neues Array zurück, damit Sie dies tun könnenEine weitere Alternative ist der Unveränderlichkeitshelfer von React
quelle
concat
nimmt ein Array, also wirst du wollenthis.state.list.concat([newObject])
.concat
wird es in ein Array eingeschlossen, aber es ist besser, das Array selbst hinzuzufügen, um explizit zu sein: Wenn Sie das nächste Element haben[[1,2], [3,4]]
und hinzufügen möchten[5,6]
, müssen Sie es.concat([[5,6]])
anders machen Ich werde mit enden[[1,2], [3,4], 5, 6]
.Array.concat
sicher besser, eine weitere Bibliothek hinzuzufügen.setState () kann mit einer Funktion als Parameter aufgerufen werden:
oder in ES5:
quelle
this.setState((state) => ({ list: state.list.push(newObj) }))
NUMBER
, das auf dielist
Variable gesetzt wirdthis.setState((state) => ({ list: [...state.list, newObj] }))
Update 2016
Mit ES6 können Sie Folgendes verwenden:
quelle
...[newObject]
ist das gleiche wie geradenewObject
.Aus den Reaktionsdokumenten ( https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous ):
Also sollten Sie dies stattdessen tun:
quelle