setState vs replaceState in React.js

Question

Ich bin neu in React.js Bibliothek und ich wurde über einige der Tutorials gehen und ich kam in:

• this.setState
• this.replaceState

Die Beschreibung gegeben ist nicht sehr klar (IMO). Ähnlich

setState is done to 'set' the state of a value, even if its already set 
in the 'getInitialState' function. 

,

The replaceState() method is for when you want to clear out the values 
already in state, and add new ones. 

Ich versuchte this.setState({data: someArray}); gefolgt von this.replaceState({test: someArray}); und console.logged sie dann und ich fand, dass state jetzt sowohl data und test hatte.

Dann habe ich versucht, this.setState({data: someArray}); gefolgt von this.setState({test: someArray}); und console.logged sie dann und ich fand, dass state hatte wieder beide data und test.

Also, was genau ist der Unterschied zwischen den beiden?

Answer 1

Mit setState werden die aktuellen und vorherigen Zustände zusammengeführt. Mit replaceState löst es den aktuellen Status aus und ersetzt ihn nur durch das, was Sie bereitstellen. Normalerweise wird setState verwendet, es sei denn, Sie müssen die Schlüssel aus irgendeinem Grund wirklich entfernen. aber sie auf false/null zu setzen, ist normalerweise eine eindeutigere Taktik.

Während es möglich ist, könnte es sich ändern; replaceState verwendet derzeit das als Status übergebene Objekt, d. h. replaceState(x), und sobald es this.state === x ist. Dies ist ein wenig leichter als setState, also könnte es als eine Optimierung verwendet werden, wenn Tausende von Komponenten ihre Zustände häufig einstellen.
_{Ich behauptete dies mit this test case.}

---

Wenn Ihr aktueller Zustand ist {a: 1}, und rufen Sie this.setState({b: 2}); Wenn der Status angewendet wird, wird {a: 1, b: 2} angezeigt. Wenn Sie this.replaceState({b: 2}) aufgerufen haben, wäre Ihr Status {b: 2}.

Randnotiz: Der Status wird nicht sofort eingestellt, also tun Sie nicht this.setState({b: 1}); console.log(this.state) beim Testen.

Answer 2

Definition von Beispiel:

// let's say that this.state is {foo: 42} 

this.setState({bar: 117}) 

// this.state is now {foo: 42, bar: 117} 

this.setState({foo: 43}) 

// this.state is now {foo: 43, bar: 117} 

this.replaceState({baz: "hello"}) 

// this.state. is now {baz: "hello"} 

Beachten Sie dies aus der docs, aber:

setState() nicht sofort this.state mutieren, sondern schafft einen anstehend Übergang. Der Zugriff auf this.state nach dem Aufruf dieser Methode kann möglicherweise den vorhandenen Wert zurückgeben.

Das Gleiche gilt für replaceState()

Answer 3

Nach dem docs geht, replaceState könnte veraltet erhalten:

Diese Methode ist auf ES6 Klasse Komponenten nicht zur Verfügung, die React.Component erweitern. Es kann vollständig in einer zukünftigen Version von React entfernt werden.