useLayoutEffect的用法

作用:当在useEffect里要操作DOM时,可以在useLayoutEffect里完成,否则可能会出现闪屏,useLayoutEffect里的callback函数会

           在DOM更新完成后立即执行,但是会在浏览器绘制之前完成

例子:

          useEffect:           useEffect(()=>{

                                                        TweenMax.to(REl.current,0,{x:600})//当组件加载完成后,0秒时间内,移动x的位置

                                            },[ ]);

        //页面会一闪而过

           useLayoutEffect:              useLayoutEffect(()=>{

                                                        TweenMax.to(REl.current,0,{x:600})//当组件加载完成后,0秒时间内,移动x的位置

                                            },[ ]);

      //页面会直接显示移动后的效果

     

         

你可能感兴趣的:(useLayoutEffect的用法)