fix(useLayoutEffect) : useIsomorphicLayoutEffect to declutter Server …

…Logs (#167) * fix(useLayoutEffect): introduce useIsomorphicLayoutEffect to declutter server logs * refactor(lint): revert unintended linting changes * refactor(rc-util): utilize useLayoutEffect that already exits in rc-util Co-authored-by: Shaleen Kachhara <[email protected]>
react-component · Jan 6, 2022 · aa86c65 · aa86c65 · vercel · Jan 6, 2022
1 parent 526bc63
commit aa86c65
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 3 deletions.
diff --git a/examples/animate.tsx b/examples/animate.tsx
@@ -5,6 +5,7 @@ import * as React from 'react';
 import CSSMotion from 'rc-animate/lib/CSSMotion';
 import classNames from 'classnames';
 import List, { ListRef } from '../src/List';
+import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
 import './animate.less';
 
 let uuid = 0;
@@ -58,7 +59,7 @@ const MyItem: React.ForwardRefRenderFunction<any, MyItemProps> = (
   ref,
 ) => {
   const motionRef = React.useRef(false);
-  React.useLayoutEffect(() => {
+  useLayoutEffect(() => {
     return () => {
       if (motionRef.current) {
         onAppear();

diff --git a/src/List.tsx b/src/List.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useRef, useState, useLayoutEffect } from 'react';
+import { useRef, useState } from 'react';
 import classNames from 'classnames';
 import Filler from './Filler';
 import ScrollBar from './ScrollBar';
@@ -11,6 +11,7 @@ import useDiffItem from './hooks/useDiffItem';
 import useFrameWheel from './hooks/useFrameWheel';
 import useMobileTouchMove from './hooks/useMobileTouchMove';
 import useOriginScroll from './hooks/useOriginScroll';
+import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
 
 const EMPTY_DATA = [];
 

diff --git a/src/hooks/useMobileTouchMove.ts b/src/hooks/useMobileTouchMove.ts
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { useRef } from 'react';
+import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
 
 const SMOOTH_PTG = 14 / 15;
 
@@ -67,7 +68,7 @@ export default function useMobileTouchMove(
     }
   };
 
-  React.useLayoutEffect(() => {
+  useLayoutEffect(() => {
     if (inVirtual) {
       listRef.current.addEventListener('touchstart', onTouchStart);
     }