如何在反应中使用其他js插件？

Question

我最近遇到一个问题，我想在我的nextjs实践项目中使用一个3rd party插件。请注意，我是React的初学者，因此，我很难将自己的想法围绕“反应方式”做事。

我的问题是我不知道如何正确初始化/配置项目中的插件。

例如，我想使用这个smoothscroll js插件。常规的静态站点方法是在html文件中添加脚本标签，然后通过调用插件对其进行初始化。例如：

const tracks = Array.from(localParticipant.videoTracks.values())
                 .map(publication => publication.track);

但是，由于虚拟DOM，这种方法无法起作用。任何指针将不胜感激！

Answer 1

与其在您初始化主应用程序的app.js中的script标签中编写此代码，在它的componentDidMount钩中添加它。

componentDidMount () {
  new GambitSmoothScroll({
    amount: 150, // The scroll amount
    speed: 900 // The scroll speed
  });
}

我在这里使用的是，您在代码的顶部包含“ GambitSmoothScroll”。为了使用它。

Answer 2

通常，我们在React中使用npm或yarn来管理软件包。我是这个特定的第三方，建议您阅读此网站smoothscroll 您可以在终端中运行它以添加它。

npm install --save smoothscroll