如何拥有一个单独的 js 文件来处理 Reactjs 中的 API 调用

Question

我想构建我的反应项目并设置我的APIs 和方法，以便在单独的文件中进行调用。我来自 Angular 背景，在 Angular 中有处理所有http调用的服务。

因此，假设我有一个包含两个文件的functional component调用Supplier，Supplier.js并且Supplier.css. 我想添加一个新文件并SupplierServices.js在这个文件中调用它我想编写所有调用服务器的方法并简单地将它导入到Supplier.js.

如何实现这一目标？

Answer 1

您的request.js文件：

import axios from 'axios';

export default () => axios.get('/test');

您的组件component.js：

import React from 'react';
import {request} from './request';

const Component = () => {
  .....
  request();
}