program tip

React.js의 setState 대 replaceState

radiobox 2020. 8. 30. 08:00
반응형

React.js의 setState 대 replaceState


저는 React.js 라이브러리를 처음 접했고 튜토리얼 중 일부를 살펴 보았는데 다음과 같이 나타났습니다.

  • this.setState
  • this.replaceState

제공된 설명이 명확하지 않습니다 (IMO).

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.

나는 this.setState({data: someArray});다음을 시도한 this.replaceState({test: someArray});다음 console.logged하고 state이제 datatest.

그럼, 시도 this.setState({data: someArray});다음에 this.setState({test: someArray});다음을 console.logged 나는 것을 발견 state다시 모두 가지고 datatest.

그렇다면 둘의 차이점은 정확히 무엇입니까?


으로 setState현재 및 이전 상태 병합됩니다. 을 사용 replaceState하면 현재 상태를 버리고 사용자가 제공 한 것만으로 바꿉니다. setState어떤 이유로 키를 제거해야하는 경우가 아니면 일반적 으로 사용됩니다. 그러나이를 false / null로 설정하는 것이 일반적으로보다 명확한 전술입니다.

가능하지만 변경 될 수 있습니다. replaceState는 현재 상태로 전달 된 객체를 사용합니다. 즉 replaceState(x), 일단 설정되면 this.state === x. 이것은보다 약간 가볍기 setState때문에 수천 개의 구성 요소가 상태를 자주 설정하는 경우 최적화로 사용할 수 있습니다.
나는 이 테스트 케이스이것을 주장했다 .


현재 상태가 {a: 1}이고 전화하면 this.setState({b: 2}); 상태가 적용되면 {a: 1, b: 2}. 당신이 전화하면 당신 this.replaceState({b: 2})의 상태가 될 것입니다 {b: 2}.

참고 : 상태는 즉시 설정되지 않으므로 this.setState({b: 1}); console.log(this.state)테스트 설정하지 마십시오 .


예에 의한 정의 :

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

그러나 문서 에서 이것을 기록하십시오 .

setState ()는 this.state를 즉시 변경하지 않지만 보류 상태 전환을 만듭니다. 이 메서드를 호출 한 후 this.state에 액세스하면 잠재적으로 기존 값을 반환 할 수 있습니다.

같은 경우 replaceState()


에 따르면 문서 , replaceState사용되지 않는 얻을 수 있습니다 :

이 메서드는 React.Component를 확장하는 ES6 클래스 구성 요소에서는 사용할 수 없습니다. 향후 React 버전에서는 완전히 제거 될 수 있습니다.

참고 URL : https://stackoverflow.com/questions/23293626/setstate-vs-replacestate-in-react-js

반응형