We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
useInsertionEffect
useLayoutEffect
1 parent 9c75d2f commit 9809bf5Copy full SHA for 9809bf5
src/index.ts
@@ -1,5 +1,14 @@
1
import * as React from 'react';
2
3
+/**
4
+ * Use `useEffect` during SSR and `useLayoutEffect` in the Browser & React Native to avoid warnings.
5
+ */
6
+const useClientLayoutEffect =
7
+ typeof document !== 'undefined' ||
8
+ (typeof navigator !== 'undefined' && navigator.product === 'ReactNative')
9
+ ? React.useLayoutEffect
10
+ : React.useEffect;
11
+
12
/**
13
* React hook which returns the latest callback without changing the reference.
14
*/
@@ -14,7 +23,7 @@ function useLatestCallback<T extends Function>(callback: T): T {
23
return ref.current.apply(this, args);
15
24
} as unknown as T).current;
16
25
17
- React.useInsertionEffect(() => {
26
+ useClientLayoutEffect(() => {
18
27
ref.current = callback;
19
28
});
20
29
0 commit comments