已知在组件卸载时会执行return函数,其实在依赖项变更时也会执行。
import { useEffect, useState } from 'react';
export default function HomePage() {
const [count, setCount] = useState(0);
useEffect(() => {
console.log('effect', count);
return () => {
console.log('effect 清理', count);
}
}, [count])
return (
<div>
<button
onClick={() => setCount(pre => pre + 1)}
>count + 1</button>
</div>
);
}
点击按钮执行结果:
effect 0 //初始化
effect 清理 0 //第一次点击
effect 1 //第一次点击
effect 清理 1 //第二次点击
effect 2 //第二次点击
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » [React]useEffect中return函数执行时机
发表评论 取消回复