Javascript 如何隔离和提取常见axios调用以防止代码重复？

我正在尝试将一组axios调用移动到一个单独的实用程序文件中，这样我就可以共享它们，避免到处重写相同或类似的axios调用

然而，我不知道如何做到这一点，并且仍然利用调用的

然后
和
捕获部分，在这部分中，我做一些独特的事情，比如更新状态和/或变量

这是我使用的axios调用，在我的应用程序中也有类似的变化：

axios({
  method: "post",
  url: `/api/PlanetTime/Battle/${this.props.levelId}/files/upload`,
  data: bodyFormData,
  config: {
    headers: { "Content-Type": "multipart/form-data" }
  }
})
  .then(response => {
    let newFile = response.data[response.data.length - 1];
    this.props.onUploadEnd(response.data);
    this.setState({
      selectedFile: null,
      file: null
    });
  })
  .catch(response => {
    console.log("upload error!");
  });

那么，有没有一种方法可以让axios调用像这样，但更通用，这样我就可以接受不同的URL、数据等，并且仍然可以利用调用的
，然后
部分？
您可以返回
axios
调用。返回axios调用（内部调用
axios.request
并返回承诺）将允许链接性：

function createRequest(url, data) {
  return axios({
    // Set up axios instance config
  });
}

然后，在需要时，导入它：

createRequest('…', { … })
  .then(response => { … })
  .catch(error => { … });

哦，我明白了，那么“then”和“catch”部分可以在任何需要它们的组件中？它们的行为方式与我将它们直接连接到axios调用的方式相同？@SkyeBoniwell是的，因为您正在从
createRequest
返回相同的承诺。我可以拥有它以便在一个组件中多次使用它吗？像const uploadShipPhoto=createRequest（{…}），然后uploadWeaponPhoto=createRequest（{…}）。。。等等…@SkyeBoniwell当然。每次调用
createRequest
时，您都会分别调用
axios
。通过执行以下操作，它是否看起来更像es6：export const createRequest=（url，数据）=>{axis（{…}）？谢谢