在React中平滑滚动

I came across this article on Codrops about altering the scroll behaviour with smooth easing: https://tympanus.net/Tutorials/SmoothScrollAnimations/

Here is the js file responsible for this subtle effect: https://github.com/codrops/SmoothScrollAnimations/blob/master/js/demo.js

我想学习如何将基于此类的oop语法从原始javascript转换为React。 我已经想出了一些自定义钩子可以派上用场(useWindowsSize或useOnscroll),但我想不出将所有其他与类相关的东西传递给无状态功能组件结构的方法。

我知道这是Scrolljacking,它不应该在网页中使用,但是我正在尝试学习如何完全切换以对我的项目做出反应。

我的问题是,您将如何重构此代码?

(ps.s.我不是在找人为我做这份工作。我只是在寻求关于如何应对这一挑战的正确方法的建议,因为现在我一直不知道从哪里开始。)