axios的get请求传入数组参数后端无法接收的问题

news/2024/7/10 2:32:55 标签: 前端, vue, javascript, 前端框架

问题描述

在做项目时,需要把前端的数组通过axios的get请求发送到后端处理,于是像这样直接发送:

javascript">  axios.get(
      url,
      {
          params:
          {
            arr: update_arr
          }
      }
  	)

这时在后端接收后报错说:没有 ‘arr’ 这个key:

arr = request.GET['arr']
print(arr)  # 报错显示 没有 ‘arr’ 这个key

那就先不指定key,直接GET,发现request请求中把‘arr’变成了‘arr[]’

arr = request.GET
print(arr)  
# 输出:<QueryDict: {'arr[]': ['{"day":"2023-03-14","type":0}', '{"day":"2023-03-15","type":0}']}>

那我们就用’arr[]’ 这个key去取数据,但是输出的是传过去数组的最后一个元素

arr = request.GET['arr[]']
print(arr)  
# 输出:{"day":"2023-03-15","type":0}

所以axios的get请求并不能像这样直接传数组,那该怎么办呢?


解决办法

在网上查阅大量资料,普遍的是提供了两种方法:
1、自己编写数组序列化器
2、使用qs插件
详情可参考:
https://blog.csdn.net/weixin_62277266/article/details/124158958
https://www.cnblogs.com/kingreatwill/p/12641238.html#/cnblog/works/article/12641238
但本人对js代码不是很熟悉,同样也不想装额外装插件,所以就自动跳过了这两种普遍方法,采取一种曲线救国的方法。

将数组转换成字符串传送:

javascript">  axios.get(
      url,
      {
          params:
          {
            arr: JSON.stringify(update_arr)
          }
      }
  	)

这样我们在后端只需稍微处理一下,我们就可以在后端拿到我们想要的数组了

 from ast import literal_eval
 ...
 arr = request.GET['arr']
 print(literal_eval(arr))
 # 输出: [{'day': '2023-03-14', 'type': 0}, {'day': '2023-03-15', 'type': 0}]

http://www.niftyadmin.cn/n/125002.html

相关文章

8.SpringSecurity中的核心过滤器-CsrfFilter

SpringSecurity中的核心过滤器-CsrfFilter Spring Security除了认证授权外功能外&#xff0c;还提供了安全防护功能。本文我们来介绍下SpringSecurity中是如何阻止CSRF攻击的。 一、什么是CSRF攻击 跨站请求伪造&#xff08;英语&#xff1a;Cross-site request forgery&#…

基于Citespace和vosviewer文献计量学可视化SCI论文高效写作方法

文献计量学是指用数学和统计学的方法&#xff0c;定量地分析一切知识载体的交叉科学。它是集数学、统计学、文献学为一体&#xff0c;注重量化的综合性知识体系。特别是&#xff0c;信息可视化技术手段和方法的运用&#xff0c;可直观的展示主题的研究发展历程、研究现状、研究…

入门力扣自学笔记242 C++ (题目编号:1653)

1653. 使字符串平衡的最少删除次数 题目&#xff1a; 给你一个字符串 s &#xff0c;它仅包含字符 a 和 b​​​​ 。 你可以删除 s 中任意数目的字符&#xff0c;使得 s 平衡 。当不存在下标对 (i,j) 满足 i < j &#xff0c;且 s[i] b 的同时 s[j] a &#xff0c;此时…

初识Node.js

文章目录初识Node.jsNode.js简介fs模块演示路径问题path路径模块http模块创建web服务器得基本步骤req请求对象res响应对象解决中文乱码问题模块化的基本慨念1、模块化2、Node.js中模块的分类3、Node.js中的模块作用域3.1什么是模块作用域4、向外共享模块作用域中的成员4.1modul…

MySQL常用函数整理

MySQL常用函数整理sql函数分类一、流程控制1、判断值为null或空字符串2、IF函数3、IFNULL函数4、CASE函数(1) 相当于switch case的作用(2) 相当于if elseif的作用5、COALESCE函数二、字符串类&#xff08;GBT答案&#xff09;1、用于select、insert等子句中2、用于where子句中其…

【设计模式之美 设计原则与思想:设计原则】22 | 理论八:如何用迪米特法则(LOD)实现“高内聚、松耦合”?

今天&#xff0c;我们讲最后一个设计原则&#xff1a;迪米特法则。尽管它不像 SOLID、KISS、DRY 原则那样&#xff0c;人尽皆知&#xff0c;但它却非常实用。利用这个原则&#xff0c;能够帮我们实现代码的“高内聚、松耦合”。今天&#xff0c;我们就围绕下面几个问题&#xf…

LeetCode201_201. 数字范围按位与

LeetCode201_201. 数字范围按位与 一、描述 给你两个整数 left 和 right &#xff0c;表示区间 [left, right] &#xff0c;返回此区间内所有数字 按位与 的结果&#xff08;包含 left 、right 端点&#xff09;。 示例 1&#xff1a; 输入&#xff1a;left 5, right 7 输…

硬件学习 软件 Cadence day09 芯片PCB 封装导出DXF 文件

1.打开自己要导出 DXF 文件的 PCB 封装 (Allegro 软件) 2.导出DXF 文件的按钮 1.点击按钮&#xff0c;打开窗口 2.填写数据 3. 按下 Edit... 按钮 4. 编辑数据 5. 导出数据 &#xff0c;生成DXF 文件 下面的选项自己选择 &#xff1a; Color mapping &#xff1a; …