时间戳

首页 > 解决方案 > React.js - 在 componentDidMount() 中调用函数时状态不会更新

javascript - React.js - 在 componentDidMount() 中调用函数时状态不会更新

问题描述

当我在页面上滚动时，我遇到了更改选项卡中标签状态的问题。我不知道 componentDidMount() 是否对此负责，但我已经尝试了很多东西，但我无法找到解决方案。这是代表我所有问题的演示： https ://codesandbox.io/embed/clever-babbage-bzlbe?fontsize=14&hidenavigation=1&theme=dark

如果您注意到，阴影会在您第二次向下滚动时失去过渡，但如果您删除this.setState's，它将是完美的。这怎么可能解决？

标签： javascriptreactjsmountsetstateintersection-observer

解决方案

您正在使用this.setState.scrolled而不是this.state.scrolled并且您正在分配true给它而不是检查

(this.state.scrolled == true ? (
              "THIS NEEDS TO CHANGE"
            ) : (
              <Box
                fontFamily="Nunito"
                fontSize={18}
                fontWeight={700}
                color="text.secondary"
                className="text-uppercase pr-4"
              >
                TO THIS
              </Box>
            ))

这样做应该可以修复您的代码。

推荐阅读