umi3项目axios 请求参数序列化参数

由于get 请求中有一个日期参数 dates 是一个数组类型。

未处理参数时请求地址是这样的:/api/list?page=1&pageSize=10&keyWord=&dates[]=2024-06-10&dates[]=2024-06-24

会发现dates后面有中括号,所以前端需要将参数格式处理变成如下:/api/list?page=1&pageSize=10&keyWord=&dates=2024-06-10&dates=2024-06-24

利用参数paramsSerializer,传递一个参数处理函数

ts 复制代码
import axios from 'axios'

const instance = axios.create({});

const { data } = await instance({
  url: '/records',
  method: 'GET',
  params,
  // 序列化参数
  paramsSerializer: function (params) {
    let str: string[] = [];
    for (let key in params) {
      // console.log('item', key);
      if (key === 'createdDates') {
        params[key]?.length &&
          str.push(...[`${key}=${params[key][0]}`, `${key}=${params[key][1]}`]);
      } else {
        str.push(`${key}=${params[key]}`);
      }
    }
    return str.join('&');
  },
});
相关推荐
淡笑沐白12 小时前
Axios全解析:从基础到高级实战技巧
axios
飞奔的龟龟2 天前
详解中间件
js
(((φ(◎ロ◎;)φ)))牵丝戏安3 天前
根据输入的数据渲染柱形图
前端·css·css3·js
wxl7812276 天前
坐席业绩数据分析
html·js·csv·bi
Code_Geo7 天前
在js中大量接口调用并发批量请求处理器
js·接口调用·并发请求
帅云毅7 天前
Screeps Arena基础入门
学习·js·印象笔记
prog_61039 天前
【笔记】当个自由的书籍收集者从canvas得到png转pdf
pdf·canvas·js·png
专注VB编程开发20年13 天前
JS检测htm哪个子节点的内容被修改addEventListener(‘input‘, (event)
前端·html5·js
碳酸的唐13 天前
PDF智能解析与知识挖掘:基于pdfminer.six的全栈实现
python·pdf·js
前端OnTheRun15 天前
新闻客户端案例的实现,使用axios获取数据并渲染页面,路由传参(查询参数,动态路由),使用keep-alive实现组件缓存
vue.js·axios·vue2·路由·vue-router