Java函数外部的常量变量

问题描述

我有多个导出功能来处理API请求。我遇到了一些问题。

请在此处阅读我的代码：

export const CreateAPI = (path,dataForm) => {
  const loading = document.querySelector('.loading-bar');
  loading.classList.add('is-loading');

  return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`,dataForm,{
    headers: { 'Content-Type': 'multipart/form-data' }
  })
    .then(res => {
      if (res.status >= 200 && res.status <= 299) {
        loading.classList.remove('is-loading');
        return res.status
      } else {
        Promise.reject(res);
      }
    })
    .catch(err => console.log(err));
}

export const ReadAPI = (path,params) => {
  const loading = document.querySelector('.loading-bar');
  loading.classList.add('is-loading');

  return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
    .then(res => {
      if (res.status >= 200 && res.status <= 299) {
        loading.classList.remove('is-loading');
        return res.data
      } else {
        Promise.reject(res);
      }
    })
    .catch(() => {
      localStorage.removeItem('jwtToken');
      window.location.href = './login';
    });
}

如何使 const 加载可用于任何导出函数？

解决方法

像这样？顺便说一句，您可以将加载服务提取到一个单独的文件中。

简单的小提琴来演示这个想法。

https://jsfiddle.net/ramseyfeng/hpaLn9kj/10/

const loading = document.querySelector('.loading-bar');
loading.start = () => {
  loading.classList.add('is-loading');
};

loading.stop = () => {
  loading.classList.remove('is-loading');
};

export const CreateAPI = (path,dataForm) => {
  loading.start();
  return Axios.post(`${process.env.REACT_APP_API_SERVER}${path}`,dataForm,{
    headers: { 'Content-Type': 'multipart/form-data' }
  })
    .then(res => {
      if (res.status >= 200 && res.status <= 299) {
        loading.stop();
        return res.status
      } else {
        Promise.reject(res);
      }
    })
    .catch(err => console.log(err));
}

export const ReadAPI = (path,params) => {
  loading.start();
  return Axios.get(`${process.env.REACT_APP_API_SERVER}${path}${params || ''}`)
    .then(res => {
      if (res.status >= 200 && res.status <= 299) {
        loading.stop();
        return res.data
      } else {
        Promise.reject(res);
      }
    })
    .catch(() => {
      localStorage.removeItem('jwtToken');
      window.location.href = './login';
    });
}