get请求方法中传递数组，后端获取不到怎么办？

最新推荐文章于 2023-03-06 17:36:24 发布

阿白不白

最新推荐文章于 2023-03-06 17:36:24 发布

阅读量1.6k

点赞数

分类专栏：开发笔记文章标签： vue ajax js jquery es6

本文链接：https://blog.csdn.net/weixin_42736366/article/details/115177707

版权

开发笔记专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文探讨了如何在axios和ajax中正确处理数组参数，通过导入qs库和使用paramsSerializer或traditional选项，解决了在URL中传递数组时的编码问题，提供了解决方案和示例代码。

摘要由CSDN通过智能技术生成

使用axios或者ajax调用后端接口，正常在get方法中传递数字、字符串等是直接拼接在url后面的，但是一旦参数为数组就显得很怪异。

现象

在这里插入图片描述
不仅前端看起来很怪异，后端肯定也取不到这个字段的数据。

解决方法

axios

首先import qs from 'qs’，其次需要参数序列化 paramsSerializer

import qs from 'qs’

// 接口请求
export function permissionUpd(roleId, menuIds, permission) {
  return request({
    permission: permission,
    url: '/admin/role/roleMenuUpd',
    method: 'put',
    params: {
      roleId: roleId,
      menuIds: menuIds
    },
    paramsSerializer: params => {
      return qs.stringify(params, {
        indices: false
      })
    }
  })
}

ajax

添加 traditional:true

$.ajax({
  type: 'get',
  url: '/admin/role/roleMenuUpd',
  data: requestJson,
  async: true,
  traditional: true,
  success: function(){
    // 成功回调逻辑代码
  },
  error: function(){
    // 失败回调逻辑代码
  }
})