useCallback 후크는 함수 참조만 캐시합니까, 아니면 함수 자체의 값/결과도 캐시합니까? 또한 종속성 배열에서 ref를 사용하면 실제로 구성 요소의 ref와 같은 효과가 있습니까? 그렇지 않은 경우 참조 값 변경이 적절한 효과를 갖도록 하는 방법이 있습니까?
원래는 함수 참조만 캐시될 것이라고 생각했지만 기사를 읽은 후 useCallback(fn, deps)가 useMemo(() => fn, deps)와 동일하다는 것을 알게 되었고 잘 모르겠습니다. 이것이 사실이라면 실제로도 그렇습니다. 그리고 컴포넌트의 ref를 의존성(Video.js, React-Slick 등)으로 사용해 보았지만 다른 의존성에 비해 큰 영향은 없는 것 같습니다.
예,
useCallback
의 목적은 지정한 종속성이 변경되지 않는 한 함수가 렌더링 간에 참조를 유지하도록 허용하는 것입니다.예를 들어
f(x,y)=>x+y
함수가 있는 경우 빈 종속성 배열useCallback((x,y)=>x+를 사용할 수 있습니다. y,[])
, 이 함수는 절대 변경되지 않습니다. 출력을 구문 분석하는 데 인수만 사용하기 때문에 항상 일관된 동작을 생성합니다. 그러나 다른 함수h
와 다른 외부 값z
가 있고h
가h(x, y)=>x+y+z
인 경우 종속성에z
를 포함해야 합니다. 그러면z
가 변경되면f(x,y)=>x+y
,你可以使用空的依赖数组useCallback((x,y)=>x+y,[])
,这个函数将永远不会改变。它始终会产生一致的行为,因为它只使用其参数来解析输出。但是,如果你有另一个函数h
和另一个外部值z
,它可能会发生变化,而且h
定义为h(x,y)=>x+y+z
,那么你需要将z
包含在依赖项中,以便如果z
发生变化,从useCallback
에서 반환된 함수는 새로운 참조.따라서
는 덜 유용하므로 결과를 별도로 기억해야 합니다.useCallback
的用途通常是当你传递函数时,它不会触发子组件重新渲染,或者当你在子组件的useEffect
声明中使用函数作为依赖项时。如果函数内部的操作很昂贵,那么useCallback
의 사용은 일반적으로 하위 구성 요소가 다시 렌더링되도록 트리거하지 않도록 함수를 전달하거나 해당 함수를 하위 구성 요소의useEffect
선언에서 종속성으로 사용할 때 사용됩니다. 함수 내부의 연산 비용이 많이 든다면
상태로 저장되는 것에 대해 유용할 수도 있지만 잘 모르겠습니다.ref
的事情,我认为在依赖项中包含ref
并不会有任何作用,它就像数组为空一样。也许如果ref
여기에 유용할 수 있는 몇 가지 예가 있는링크 https://stackblitz.com/edit/stackblitz-starters-wwyw9f?file=src%2FApp.tsx
가 있습니다. 삭제될 경우 여기에 붙여넣을 수도 있습니다.으아악
도움이 되길 바랍니다