axios常用操作

一：函数化编程

1:编写可复用的方法

axios(config)的方法中，有必须的url参数和非必须的options参数。所以我们可以先写一个接受这两个参数的方法，在这个方法中我们可以添加一些业务化的代码，例如修改headers中的一些参数。

function request(url, options) {  const defaultOptions = {    credentials: 'include',  };  const newOptions = { ...defaultOptions, ...options };  newOptions.headers = {    ...newOptions.headers,  };  if (newOptions.method === 'POST' || newOptions.method === 'PUT') {    newOptions.headers = {      Accept: 'application/json',      'Content-Type': 'application/json; charset=utf-8',      ...newOptions.headers,    };    newOptions.data = JSON.stringify(newOptions.data);  }  return axios({ url, ...newOptions })    .then(checkStatus)    .then((response) => {      return response.data;    })    .catch((e) => {      if (status === 403) {        // 跳转      }    });}export default request;

然后我们在services文件中调用这个方法：

export async function api() {  return request('/aa/bb');}export async function api2(params) {  return request('/aa/cc', {    method: 'PUT',    data: params,  });}

　　

 

二：拦截

1：如何在axios拦截时修改headers中的值(例如多语言)

axios.interceptors.request.use(  (config) => {    const config2 = config;    config2.timeout = 30000; //eslint-disable-line    config2.headers['Accept-language'] = 'USSSSS';    return config2;  },  (error) => {    // Do something with request error    return Promise.reject(error);  });

如果这里直接操作config会报  （eslint）的错误。