NextJs /成帧器运动:使用useViewportScroll时,出现以下警告:警告:useLayoutEffect在服务器上不执行任何操作,

时间:2020-05-22 12:20:07

标签: reactjs typescript next.js redux-toolkit framer-motion

我正在将NextJs与Framer Motion一起使用。一切正常,但是我得到了这个警告:

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client.

1 个答案:

答案 0 :(得分:0)

Next进行SSR,这就是为什么它在useLayoutEffect时抛出此警告而不在服务器上运行的原因。

官方docs of useLayoutEffect

签名与useEffect相同,但是在所有DOM突变后都会同步触发。使用它从DOM读取布局并同步重新渲染。在浏览器有机会绘制之前,useLayoutEffect中安排的更新将被同步刷新。