如何将外部 JavaScript 库包含到 ReactJS 中？

ReactJS 是一种用于构建用户界面的 JavaScript 库，它可以与各种 JavaScript 库和框架协同工作。在 ReactJS 中包含外部 JavaScript 库的过程可能会有点棘手，但是一旦掌握了技巧，就很容易了。

步骤一：安装依赖

在 ReactJS 项目中，您需要使用 npm 或者 Yarn 安装外部 JavaScript 库的依赖。打开控制台，切换到项目的根目录，然后输入以下命令：

npm install <library-name> --save

# 或者

yarn add <library-name>

这将会安装您选择的库并将其添加到项目的依赖列表中。

步骤二：导入库文件

在您的 ReactJS 组件中导入外部 JavaScript 库的文件并将其添加到组件中。您可以将该库保存在 src 目录下的 lib 目录内，然后在您的组件文件顶部引用它：

import library from '../lib/library.js';

根据您选择的库和它的导出方式，您可能需要使用其他语法。但是您一定要确保您已经正确导入了库文件，并且可以访问它的方法。

步骤三：使用库方法

您可以在组件内使用外部 JavaScript 库的方法，例如：

import React, { Component } from 'react';
import library from '../lib/library.js';

class MyComponent extends Component {
  handleClick = () => {
    library.doSomething();
  };

  render() {
    return (
      <button onClick={this.handleClick}>
        Click me!
      </button>
    );
  }
}

export default MyComponent;

在此示例中，我们将 library 导入到组件中，然后在 handleClick 方法中使用其 doSomething() 方法。您可以使用类似的方法来访问和使用您选择的任何其他库的方法。

结论

这就是将外部 JavaScript 库包含到 ReactJS 中的基本步骤。尽管这可能有点让人望而生畏，但是一旦您掌握了这个过程，您就可以很轻松地将各种 JavaScript 库添加到您的 ReactJS 项目中了。