vue项目 get方法传参数组

get方法传参数组的时候，会出现arr[]=1&arr[]=2这样的情况，这样的传参，后端是接收不到的，无法解析。

那么我们就需要转换成这样的格式：arr=1&arr=2

 

1、这里，需要安装一个插件----qs插件（详情参考：https://github.com/ljharb/qs）

在vue项目中yarn add qs即可。

2、在拦截器文件中引入

import qs from 'qs'

3、在你自己的项目的axios拦截器中，加入下代码：

// request interceptor
service.interceptors.request.use(
  config => {
    // do something before request is sent
    if (store.getters.token) {
      config.headers['token'] = store.getters.token
    }

    // get方法传递数组的处理（重点代码）
    if (config.method === 'get') {
      config.paramsSerializer = function(params) {
        return qs.stringify(params, { arrayFormat: 'repeat' })
      }
    }

    return config
  },
  error => {
    // do something with request error
    console.log(error) // for debug
    return Promise.reject(error)
  }
)

 

---

qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })
// 'a[0]=b&a[1]=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })
// 'a[]=b&a[]=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })
// 'a=b&a=c'
qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'comma' })
// 'a=b,c'