我遇到了一个在其他情况下描述过的问题，但还没有找到解决方案。我的项目正在使用 Next.js 框架进行 react、Smooth Scrollbar 和 ScrollTrigger。我有一个 .to() ，里面有一个 scrollTrigger 对象，它在一个<Navigation />组件中。页面顶部的文本只是应该固定自己并随窗口滚动，但它只在某些情况下有效。我想我在这里没有完全理解一些生命周期的东西。所有这些重现我的错误的方法也在沙箱中的 index.js 文件的顶部进行了注释。
- 开启Smooth Scrollbar，组件中存储的scrollTrigger对象
<Navigation />，以及<Navigation />导入嵌套在主功能组件中的组件，刷新页面后效果不起作用。如果您进入<Navigation />组件中的 scrollTrigger 对象并更新其中一个值（将“结束”值更改为不同的数字），这将触发热重载而不刷新浏览器。如果您滚动回顶部并向下滚动，您将看到效果现在正在工作。 - 如果您注释掉主 index.js 组件中的整个 useEffect() 挂钩，这将禁用平滑滚动条。如果您保存文件并刷新，您将看到效果按预期工作，无需触发热重载，但现在没有平滑滚动条。
- 如果将沙箱重置为原始状态，取消注释主 index.js 组件返回中的 HTML，将其正上方的组件注释掉
<Navigation />，保存然后刷新，您会看到效果在加载时起作用，带有平滑滚动条，没有不得不触发热重载，但现在我失去了嵌套组件的能力。
任何帮助将不胜感激。在这一点上我没有想法。