为什么这个 return 语句不在我的 codesandbox UseEffect 中执行
Why on earth is not this return statement executed here in my codesandbox UseEffect
我学习 React JavaScript 并且有这个 Sandbox to play around
正如您在 PromiseLoader.js
中所见
useEffect
里面的 return
有一个从不开火的 console.log(..
为什么?
我以为 JavaScript setInterval
是异步的?
当 React 执行清理时,您 return 来自 useEffect
的函数被调用。
来自https://reactjs.org/docs/hooks-effect.html
When exactly does React clean up an effect? React performs the cleanup when the component unmounts. However, as we learned earlier, effects run for every render and not just once. This is why React also cleans up effects from the previous render before running the effects next time. We’ll discuss why this helps avoid bugs and how to opt out of this behavior in case it creates performance issues later below.
查看这个修改后的沙盒以查看其效果:https://codesandbox.io/s/promise-hotpink-loader-forked-xujbl?fontsize=14&hidenavigation=1&theme=dark
单击按钮 show/hide Promise Loader 组件。请注意,当您隐藏组件时,它会卸载,并且 console.log 表明确实正在执行清理功能。
我学习 React JavaScript 并且有这个 Sandbox to play around
正如您在 PromiseLoader.js
中所见useEffect
里面的 return
有一个从不开火的 console.log(..
为什么?
我以为 JavaScript setInterval
是异步的?
当 React 执行清理时,您 return 来自 useEffect
的函数被调用。
来自https://reactjs.org/docs/hooks-effect.html
When exactly does React clean up an effect? React performs the cleanup when the component unmounts. However, as we learned earlier, effects run for every render and not just once. This is why React also cleans up effects from the previous render before running the effects next time. We’ll discuss why this helps avoid bugs and how to opt out of this behavior in case it creates performance issues later below.
查看这个修改后的沙盒以查看其效果:https://codesandbox.io/s/promise-hotpink-loader-forked-xujbl?fontsize=14&hidenavigation=1&theme=dark
单击按钮 show/hide Promise Loader 组件。请注意,当您隐藏组件时,它会卸载,并且 console.log 表明确实正在执行清理功能。