주요 구성 요소는 모달/대화 상자를 호출하는 것입니다.
으아아아MyDialog 코드는:
으아아아취소를 클릭하고 전화를 걸어도 onClose
时,我可以看到 useEffect
已触发。请问这是什么原因呢?我的理解是不应该,因为 onClose
函数对象(来自 props
) 아무런 변화가 없습니다.
P粉1658237832023-09-13 11:52:56
useEffect
挂钩就会运行。在您的情况下,useEffect
依赖于onClose
属性。因此,每次 onClose
React의 속성은 종속성 배열의 종속성이 변경되면 실행됩니다.
그러나 코드의 onClose
函数未发生更改,由于 JavaScript 处理函数标识的方式,useEffect
도 여전히 실행될 수 있습니다. JavaScript에서는 함수를 정의할 때마다 동일한 작업을 수행하더라도 새 인스턴스입니다.
따라서 귀하의 경우에는 구성요소가 다시 렌더링될 때마다 closeDialog
定义为渲染函数中的新函数。这意味着,从 React 的角度来看,onClose
每次都是一个新函数,它会触发 useEffect
.
이 문제를 해결하려면 useCallback
挂钩来确保您的 closeDialog
함수를 사용하여 종속성이 변경되지 않는 한 렌더링 간에 안정적인 ID를 가질 수 있습니다.
위의 예에서 useCallback
返回函数的记忆版本,该版本仅在依赖项之一发生更改时才会更改。在这种情况下,依赖项数组为空 ([]),这意味着 closeDialog
함수의 정체성은 다시 렌더링되는 동안에도 안정적으로 유지됩니다.