React.StrictMode 및 fabric.js의 Canvas 인스턴스를 사용하여 다시 렌더링

Question

패브릭 캔버스와 버튼을 만들고 있는데, 이 버튼으로 인스턴스화된 모양을 선택할 수 있어야 합니다. 다음 상황에서 구성 요소가 두 번 다시 렌더링되는 이유를 이해할 수 없습니다. 따라서 원단 형태를 선택할 수 없습니다. 그러나 index.tsx 파일에서 时，渲染只发生一次，我的形状是可选择的。我可以移除를 제거하면 이것이 최선의 해결책이라고 생각하지 않습니다. 데모는 다음과 같습니다.

으아악 으아악

Answer 1

질문

React에서 useEffect가 두 번 실행되는 이유와 이를 처리하는 방법은 무엇입니까? 이 질문에는 이런 일이 발생하는 이유와 일반적인 해결책을 설명하는 좋은 답변이 있습니다.

솔루션

귀하의 경우에는 인스턴스화된 캔버스를 정리해야 합니다. 저는 Fabric에 익숙하지 않지만 문서를 읽어보면 dispose 방법 이 적절해 보입니다.

정리를 수행하는 useEffect 返回一个调用上述方法的函数。从链接的问题中可以看出，从 useEffect 함수를 반환해야 하는 것은 좋은 습관입니다. 아래에 실제 예제도 있습니다:

으아아아 으아아아