解决get传参有数组问题

432 阅读1分钟

 传参是数组

日常开发过程中,我们经常碰到参数是数组的情况。如果这时候接口method为post,那么就没什么问题,参数会被放到body里面。但当method为get时,参数会拼接到url上面,这时候如果不做出来处理会报400,导致接口出错。

引入qs

其实解决这个问题很简单,我们只要在传参前用qs处理一下即可。我们先简单了解一下qs,qs是可以将普通的object序列化为一个查询字符串,还可以反过来将查询字符传解析为一个Object。所以通过qs的序列化我们就能把传参中的数组处理。

解决方法

首先我们在项目中引入qs,npm i qs 或者yarn add qs。然后再axios请求前加上下面的代码即可。

if (config.method === 'get') {
      // If method is get,and params is Array(arr[1,2]), transform arr=1 & arr=2
      config.paramsSerializer = function(params) {
        return qs.stringify(params, { arrayFormat: 'repeat' })
      }
    }

需要说明的是,这个是对axios进行了二次封装,放在axios的请求拦截axios.interceptors.request里面的。如果直接用的aixos的话,我们直接用qs处理一下参数即可。

query = qs.stringify(params,{arrayFormat:'repeat'})