多见于开发环境。
如果你的React代码中有一段这样的逻辑,用来离开页面后卸载监听。
useEffect(() => unsubscribe, [])
多用于只执行一次卸载逻辑,比如:
我的页面一进来,startState就为true,但是在离开页面后要单独给它设置一次startState为false
就可能出现这样的代码
const [start, setStart] = useState(true);
useEffect(() => () => setStart(false), []);
它在React18的StrictMode下工作很可能不正常
因为StrictMode下页面会加载两次。那么这段卸载逻辑也会被执行一次,但是第二次加载页面的时候没有哪里的useEffect可以触发setStart(true),页面逻辑就会出现问题。
解决办法:
建议在useEffect中加入一段启动代码
const [start, setStart] = useState(true);
useEffect(() => {
setStart(true);
return () => setStart(false)
}, []);