useLayoutEffect

useLayoutEffect 是 useEffect 的一个版本，在浏览器重新绘制屏幕之前触发。useLayoutEffect 可能会影响性能。尽可能使用 useEffect。

参数

• setup：一个函数，可选择性return一个 cleanup 函数。在每次dependencies对比结果为false，React 将首先使用旧值运行 cleanup 函数（如果你提供了该函数），然后使用新值运行 setup 函数。在组件从 DOM 中移除后，React 将最后一次运行 cleanup 函数。
• 可选dependencies：是一个数组[dep1, dep2, dep3]，React 将使用 Object.is 来比较每个依赖项和它先前的值。需要注意的是dependencies的长度和顺序不能改变。

与useEffect的区别

• useLayoutEffect 是同步执行的。它可能会阻塞组件的渲染。
• useEffect 是异步执行的。它不会阻塞组件的渲染。

如果有多个 useLayoutEffect、useEffect，会先执行useLayoutEffect在执行useEffect