React 18 — useEffect의 복잡함

React 18에서 Strict Mode를 사용할 때 useEffect 후크의 까다로운 동작에 대해 알아보십시오.

Unsplash에 있는 Tim Gouw의 사진

React 18은 이미 몇 주 동안 출시되었습니다. 몇 가지 개선 사항을 제공하지만 가장 일반적으로 사용되는 후크 중 하나에 상당히 이상한 동작을 도입합니다. 그게 뭔지 알고 싶니? 여기 우리가 간다…

초기 마운트에서만 실행되어야 하는 useEffect()는 두 번 실행됩니다!

네, 잘 들었습니다! Strict 모드에서 React 18을 사용하는 경우 다음 코드는 다음과 같습니다.

다음과 같은 출력이 생성됩니다.

Hello there!
Hello there!

문서 에 명시된 대로 React 18은 Strict Mode에 대한 새로운 개발 전용 검사를 도입합니다. 이 새로운 검사는 구성 요소가 처음으로 마운트될 때마다 모든 구성 요소를 자동으로 마운트 해제 했다가 다시 마운트하여 두 번째 마운트에서 이전 상태를 복원합니다.

이러한 결정은 앞으로 React가 상태를 유지하면서 UI의 섹션을 추가 및 제거할 수 있는 기능을 추가하기를 원하기 때문에 React 팀에 의해 이루어졌습니다. 여러 번 장착 및 파괴되는 효과에 대한 구성 요소의 복원력이 필요하므로 추가 검사가 도입되었습니다.

그래서 각 구성 요소가 마운트된 다음 마운트 해제되고 마지막으로 다시 마운트됩니까?

예, 그것이 지금 작동하는 방식입니다. useEffect()다음과 같이 후크 를 사용하는 경우 :

페이지를 새로 고친 후 출력은 다음과 같습니다.

Mounting...
Unmounting...
Mounting...

요약

React 18은 Strict Mode에 대한 새로운 개발 전용 검사를 도입합니다. 이 검사는 구성 요소를 자동으로 마운트 해제했다가 다시 마운트하여 useEffect 후크가 초기 마운트에서 두 번 실행되도록 합니다.

Suggested posts

대명사는 정말 무섭다

너무 자주 그렇듯 갑자기 와닿는다 다시 중간쯤이야 <아니, 태평양에 있는 사람 말고 마룬, 카니발에 있는 사람> 모든 헤드라인이 시끄러워…..

기독교인에 대한 박해: 우리가 말하지 않는 증오 범죄

이슬람 혐오증은 잊으십시오. 기독교인(및 유대인)은 종교적 증오 범죄의 주요 피해자입니다.

기독교인에 대한 박해: 우리가 말하지 않는 증오 범죄

이성적인 마음을 가진 사람이라면 정치계와 언론계가 좌파, 심지어 극좌파에 의해 지배되고 있다는 사실을 알고 있습니다. 종교 분야에서 이러한 불균형은 분명히 눈에 띕니다. 좌익 신문과 네트워크는 기독교 신앙을 옹호하기 위해 서두르지 않습니다.

Related posts

팟캐스트가 영향력 있는 이유는 무엇입니까?

팟캐스트가 영향력 있는 이유는 무엇입니까?

지난 주에 저는 PressGazette(영국 언론 뉴스 웹사이트)를 통해 발송된 보도 자료를 보았습니다. 이 기사는 Scandi 팟캐스트 호스팅 및 광고 회사인 Acast가 팟캐스팅에서 "아마도 가장 영향력 있는" 게시자 컨소시엄을 이끌 것이라고 발표했습니다.

예술은 비정치적인가?

예술은 비정치적인가?

어제 우리는 스웨덴 가수 Loreen이 트로피를 집으로 가져가서 ABBA가 대회에서 우승한 지 50년 만에 스웨덴의 왕관을 다시 가져가면서 두 번 우승한 최초의 여성이 되는 반짝반짝하고 혼란스러운 그랜드 피날레로 올해 유로비전 송 콘테스트의 문을 닫았습니다. "워털루"와 함께. 그들은 계속해서 팝 음악의 정경에서 가장 큰 행위 중 하나가 되었습니다.

안전한 작업 환경 조성

안전한 작업 환경 조성

“그는 내가 위험에 처했을 때 나를 지켜줄 것입니다. 그가 나를 그의 천막 안에 숨길 것이다.

느린 침식: 사람들이 경력을 낭비하는 방식 공개

느린 침식: 사람들이 경력을 낭비하는 방식 공개

오늘날과 같이 급변하고 경쟁이 치열한 세상에서 경력은 개인의 성장, 재정적 안정 및 전반적인 삶의 만족도에 중요한 역할을 합니다. 그러나 많은 사람들은 침체와 불만족의 끊임없는 순환에 휩싸여 직업 생활에서 점차 쇠퇴하고 있습니다.