React中useState状态异步更新如何处理成长尾词？

本文共计1036个文字，预计阅读时间需要5分钟。

目录 + 疑惑 + 状态异常更新带来的问题 + 问题示例 + 问题解决 + 组件的解决方案 + 函数组件的解决方案 + 其他解决方案 + 结尾 + 疑惑 + 信心初开始使用 react + 函数组件的小伙伴也遇到过一坑

目录

• 疑惑
• 状态异步更新带来的问题
• 问题示例
• 问题解决
• 类组件的解决方案
• 函数组件的解决方案
• 其他解决方案
• 结尾

疑惑

相信刚开始使用react函数组件的小伙伴也遇到过一个坑，就是 useState 更新状态是异步更新的，但是react 并没有提供关于这个问题的解决方案。那我们能否使用自己的方法来解决这个问题呢？答案肯定是可以的。

状态异步更新带来的问题

就拿一个比较常见的场景来说。在react项目中，我们想在关闭对话框后再去处理其他业务。但是 useState 的状态是异步更新的。我们通过setVisible 更新状态后，状态并没有立马更新，这也就说明对话框并没有关闭，这也就造成了我们后面的逻辑在对话框没关闭时就执行了，这并不是我们想要的结果。下面来看我是如何来巧妙的解决这个问题的。