setstate vs replaceState w React.js

Question

Jestem nowy React.js Biblioteki i jadę na kilka tutoriali i natknąłem:

• this.setState
• this.replaceState

Podany opis nie jest zbyt jasny (IMO).

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

Podobnie

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

Próbowałem this.setState({data: someArray}); następnie this.replaceState({test: someArray}); a następnie console.logged je i znalazłem że state teraz miał zarówno data i test.

Następnie próbowałem this.setState({data: someArray}); następnie this.setState({test: someArray}); a następnie console.logged je i znalazłem że state znowu miał zarówno data i test.

Czym dokładnie jest różnica między tymi dwoma?

Answer 1

Po setState następuje połączenie stanów bieżących i poprzednich. Z replaceState, wyrzuca bieżący stan i zastępuje go tylko tym, co podajesz. Zwykle używa się setState, chyba że naprawdę trzeba usunąć klucze z jakiegoś powodu; ale ustawienie ich na false/null jest zwykle bardziej wyraźną taktyką.

Chociaż jest to możliwe, może się zmienić; replaceState obecnie używa obiektu przekazanego jako stan, tj. replaceState(x), a po ustawieniu this.state === x. Jest to nieco lżejszy niż setState, więc może być używany jako optymalizacja, jeśli tysiące składników często ustawia swoje stany.
_{Potwierdziłem to przy pomocy this test case.}

---

Jeśli aktualny stan jest {a: 1} i zadzwonić this.setState({b: 2}); gdy stan zostanie zastosowany, będzie to {a: 1, b: 2}. Jeśli zadzwonisz pod numer this.replaceState({b: 2}), Twój stan będzie {b: 2}.

Nota boczna: Stan nie jest ustawiany natychmiastowo, więc podczas testowania nie należy wykonywać this.setState({b: 1}); console.log(this.state).

Answer 2

Definicja przez przykład:

// 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"} 

zapoznaje się z tym od docs, choć:

setstate() nie natychmiast mutować this.state ale tworzy oczekiwaniu na przejście stanu. Dostęp do this.state po wywołaniu metody może potencjalnie zwrócić istniejącą wartość.

samo dotyczy replaceState()

Answer 3

Według docs, replaceState może się nieaktualne:

Ta metoda nie jest dostępny na klasy komponentów ES6 które rozciągają React.Component. Może zostać całkowicie usunięty w przyszłej wersji React.