useEffect的执行是异步的
import React, { useEffect, useState } from 'react';
function Example() {
const [count, setCount] = useState(0);
useEffect(() => {
console.log('useEffect executed'); // 这里会在渲染完成后异步执行
}, [count]);
console.log('Component rendered'); // 这里会在渲染阶段同步执行
return (
<div>
<p>{count}</p>
<button onClick={() => setCount(count + 1)}>Increment</button>
</div>
);
}
会打印出component 再打印出useeffect
useeffect不会阻塞渲染，会在组件渲染完成之后异步执行。渲染之后提交阶段执行这个useeffect中的代码
若需同步 可用uselayouteffect