首先,useEffect有一些副作用
- 对环境的改变即为副作用,例如修改了
document.title
。 - 不过副作用不一定要放在useEffect中。
- 理解为afterRender可能好一些,因为这些函数是在每次render之后运行的。
useEffect的用途
- 可以作为componentDidMount使用,[]作为第二个参数。
- 可以作为componentDidUpdate使用,可以指定依赖(在[]中指定),如果不写第二个参数,则任何一个状态变化时都会执行。
- 可以作为componentWillUnmount使用,通过添加一个return。
- 以上三种用途可以同时存在。
特点
如果同时存在多个useEffect,则会按照出现的顺序依次执行。
useLayoutEffect
- useEffect在浏览器渲染完成后执行。
- useLayoutEffect在浏览器渲染之前执行。
特点
- useLayoutEffect总是比useEffect先执行。
- useLayoutEffect里的任务影响了Layout。
(建议优先使用useEffect(优先渲染)以保障用户体验)