問題
當(dāng)我們需要通過get方式傳遞一個數(shù)組作為參數(shù) tag:[1,2,3,4]

預(yù)期是解析為： http://localhost:8080/htsy-integrated/test-plan/case-del?planDetailId=1&planDetailId=2

然而真相是這樣的：http://localhost:8080/htsy-integrated/test-plan/case-del?planDetailId[]=1&planDetailId[]=2，后臺是不可能解析到傳遞的參數(shù)。

解決方案

01. 自己處理

// 編輯-(批量)移除測試用例
const delTestCaseUrl = '/htsy-integrated/test-plan/case-del'

axios.get(delTestCaseUrl, {
params: {
      planDetailId：this.planDetailId
},
// 序列化數(shù)組
paramsSerializer: function(params) {
      const keys= params.keys.map(_=>`keys=${_}`).join('&');
      return `${keys}` ;
}
}).then((res)=>{
          //成功后的處理
});

02. qs插件

1、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'indices' })
// 輸出結(jié)果：'a[0]=b&a[1]=c'
2、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'brackets' })
// 輸出結(jié)果：'a[]=b&a[]=c'
3、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'repeat' })
// 輸出結(jié)果：'a=b&a=c'
4、qs.stringify({ a: ['b', 'c'] }, { arrayFormat: 'comma' })
// 輸出結(jié)果：'a=b,c'

03. axios配置

axios.interceptors.request.use(async (config) => {
//只針對get方式進行序列化
 if (config.method === 'get') {
   config.paramsSerializer = function(params) {
     return qs.stringify(params, { arrayFormat: 'repeat' })
   }
 }
}

04. 小程序

let urlQueryString = qs.stringify(options.params, {   //使用到qs ,先下載，后引入
      addQueryPrefix: true,
      allowDots: true,
      arrayFormat: 'repeat'
    });
myUrl += urlQueryString;

05. 自定義利用字符串原理（雖然隨便但這種感覺最方便~~）

// 這里注意使用+''將參數(shù)轉(zhuǎn)換成了字符串,實際上就是把arr變成了字符串傳出去
const params = {
    arr: [1,2,3,4] + '',
    list: [1,2,3,4]+ ''
}

一般用vue，所以用第一種和最后一種比較多，哈哈~~