rax
rax copied to clipboard
[BUG] useEffect 中 setState 无法保证执行时序
Describe the bug 当存在数个 useEffect 时,期望的执行时序是按顺序依次执行;此时如果 useEffect 中存在 setState ,useEffect 的执行时序会被破坏
Demo
const [val, setVal] = useState('');
useEffect(() => {
console.log(1);
setVal('any'); // 该句会截断执行
console.log(2);
}, []);
useEffect(() => {
console.log(3);
}, []);
// 期望执行顺序为 1,2,3
/**
* 1
* 3
* 2
**/
Expected behavior 上述 demo 期望打印的顺序为 1,2,3 实际为 1,3,2。 setState 时会尝试清空剩下的 useEffect,导致执行时序不对
Screenshots
(please complete the following information)
- Device: [Mac]
- OS: [macOS]
- Browser [chrome]
- Rax Version [3.7.4]
Additional context react 没有类似问题
我来看下这个问题
const [page, setPage] = useState(0); useEffect(() => { setPage(1) }, []) useEffect(() => { setPage(2) }, []) console.log('page:', page)
react中执行结果:console出来 page: 2 rax中执行结果:console出来 page:1 期望结果:按顺序执行,执行结果为 page: 2
已经确认表现不符合开发者预期,但是该改动属于 break change,当前大版本不会修复