vue 之:axios的get方法如何传递数组参数

vue中使用get方法如果直接传数组给后端会报错。
举例:

//参数
data() {
    return {
      listItem:["123","321"]
    };
  },

这种情况下传给后端会显示为 http://xxx.com?list[]=123&list[]=321
如何解决?
一般我们会在axios.js 封装文件中进行POST传参序列化设置,但如果是GET方法传数组的话也是需要进行传参设置的,代码如下:

//GET传参序列化
axios.interceptors.request.use((config) => {
    if (config.method === 'get') {
        // 如果是get请求,且params是数组类型如arr=[1,2],则转换成arr=1&arr=2,不转换会显示为arr[]=1&arr[]=2
        config.paramsSerializer = function(params) {
          return qs.stringify(params, { arrayFormat: 'repeat' })
        }
    }
    return config;
}, (error) => {
    return Promise.reject(error);
});

这堆代码加载axios.js中,应该就没问题了,就会改为 http://xxx.com?list=123&list=321

你可能感兴趣的:(vue 之:axios的get方法如何传递数组参数)