如何从嵌套对象生成查询字符串

2023-12-27

我想为我的高级过滤器生成一个查询字符串。我的对象如下所示:

{
   searchValue: {
     firstName: "John",
     lastName: "Doe",
     postalCode: "3130",
     city: "New York"
   },
    page: 1
 }

我正在使用请求参数 https://nodejs.org/api/querystring.html库来尝试格式化我想要的字符串。

export function updateAdvancedSearchQueryString<T>(props: RouteComponentProps, newValues: T) {
  props.history.push({
    pathname: props.location.pathname,
    search: queryString.stringify(newValues)
  });
}

我想要实现的输出:

/trainers?page=1&searchValue=firstName=John&lastName=Doe&postalCode=3130&city=New_York

我目前得到的输出:

/trainers?page=1&searchValue=%5Bobject%20Object%5D

如何从嵌套对象生成所需的查询字符串?


您可以有很多级别的嵌套,因此您应该递归地进行。

像这样的东西应该没问题

const data = {
  searchValue: {
    firstName: "John",
    middleInitial: null,
    lastName: "Doe",
    postalCode: "3130",
    city: "New York"
  },
  page: 1
}

const createQueryString = (data) => {
  return Object.keys(data).map(key => {
    let val = data[key]
    if (val !== null && typeof val === 'object') val = createQueryString(val)
    return `${key}=${encodeURIComponent(`${val}`.replace(/\s/g, '_'))}`
  }).join('&')
}

console.log(createQueryString(data))

但是您必须考虑传递一些带有函数作为其值之一的对象的情况,以及如何处理类似的数组。但基本思想很简单:如果您找到对象作为值,请使用相同的函数将其转换为查询字符串

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何从嵌套对象生成查询字符串 的相关文章

随机推荐

  • Postgres 数据库已锁定:查询永远运行

    我的一个 python 脚本在 Postgres 数据库上运行了一些 ALTER TABLE 查询 发生了一些问题 桌子被锁了 当我对这些表中的任何一个运行任何查询时 它告诉我查询正在运行 但什么也没有发生 目前 我只能通过关闭系统并重新启
  • iOS 5.0 用户代理字符串是什么?

    是什么iOS 5 0用户代理字符串 这里是iOS 4 0用户代理 iPhone 4 用户代理是什么 https stackoverflow com q 3105555 836407 iPhone Mozilla 5 0 iPhone CPU
  • KIF 输出:AX Exchange 错误:错误域=辅助功能代码=0“远程服务不响应 _accessibilityMachPort”

    在使用 iOS 8 1 3 的设备上运行 KIF 集成测试时 我收到大量以下类型的诊断消息作为控制台输出 AX Exchange 错误 错误域 辅助功能代码 0 远程服务 不响应 accessibilityMachPort UserInfo
  • 将文件读入数组 - Java

    我正在练习java 并在网上查看练习 然而 我陷入了我需要的地步 Read the file again and initialise the elements of the array Task 将表示成员列表的类 Members 编写为
  • file_exists() 的 PHP 不区分大小写版本

    我试图想出在 PHP 中实现不区分大小写的 file exists 函数的最快方法 我最好的选择是枚举目录中的文件并进行 strtolower 与 strtolower 比较 直到找到匹配项 我使用评论中的源代码来创建这个函数 如果找到则返
  • Firebase Auth UI 的电子邮件验证

    我在用firebase auth UI FirebaseUI Android https github com firebase FirebaseUI Android blob master auth README md 在 Android
  • django 迁移 - 具有多个开发分支的工作流程

    我很好奇其他 django 开发人员如何通过迁移来管理多个代码分支 例如在 git 中 我的问题如下 我们在 git 中有多个功能分支 其中一些带有 django 迁移 其中一些更改字段 或完全删除它们 当我切换分支时 git checko
  • 将 jQuery 与 SQL Server 数据库连接

    我正在尝试构建一个 jQuery 功能 其场景如下所示 假设用户单击网站中的图像 页面上会弹出一个 jQuery 对话框 该对话框有一个文本字段 用于输入图像的 替代文本 当用户单击提交按钮时 该页面的文本应与图像的 URL 一起保存到我的
  • Hive 日期/时间戳列

    我在 HDFS 上有一些数据 我正在尝试将其设置为通过 hive 进行查询 数据采用逗号分隔文本文件的形式 文件中的一列是日期 时间列 如下所示 Wed Aug 29 16 16 58 CDT 2018 当我尝试读取使用以下脚本创建的 Hi
  • Auth 过滤器重定向回 Laravel 中的原始 POST 请求

    看来 Redirect guest login 只适用于 GET 请求 IE 它会将经过身份验证的用户重定向到原始预期 URL GET 在存在 POST 请求的情况下 是否有办法让身份验证过滤器在用户成功登录后继续 POST 到 URL 一
  • 如何避免 Linux/X11 上的 pygame 撕裂

    我一直在玩 pygame 在 Debian Lenny 上 它似乎工作得很好 除了烦人的位图撕裂 全屏或窗口模式 我正在使用默认的 SDL X11 驱动程序 谷歌搜索表明 X11 不提供垂直同步功能 这是 SDL 的一个已知问题 即使使用使
  • 两个相似的位姿具有较大的相对欧拉角

    欧拉角表示的相似位姿有两种 s euler angle o1 0 000549608 3 1334 1 23193 s euler angle o2 0 0222646 3 10948 1 31032 但 Eigen 计算出的相对欧拉角为
  • datagridview 虚拟模式,更新 RowCount 会导致 CellValueNeeded 为所有行触发

    我正在尝试实现 datagridview 的虚拟模式 但是当我将 RowCount 设置为某个数字 以显示滚动条 时 网格希望同时拥有所有行 而不仅仅是显示的行 DataGridView grid new grid VirtualMode
  • Matlab 周末提取

    我有一个大小为 364 x 5 的矩阵 timeVectorDaily 该矩阵具有十进制天数形式的数据 例如 734870 734870 2 734870 4 734870 6 734870 8 734871 734871 2 734871
  • 同时按下按键

    我可以知道在Javascript中同时按下的键的数量吗 如果是这样 我怎样才能拥有他们的数组keyCode 您可以监听 keydown 和 keyup 事件 var keys length 0 document onkeydown func
  • 使用 Python/bokeh 在网站中嵌入绘图

    我试图在个人网站中静态嵌入散景图 但遇到了一些我不理解的行为 基本上 我使用散景生成一个绘图 如下所示 import bokeh plotting as bplt import numpy as np x np random random
  • 如何将二维数组传递到 pycuda 的内核中?

    我找到了答案here https stackoverflow com questions 13282596 how do i feed a 2 dimensional array into a kernel with pycuda 但尚不清
  • 四舍五入到最接近的 100

    如何将整数四舍五入到最接近的 100 例如 497 将四舍五入为 500 98 将四舍五入为 100 1423 将四舍五入为 1400 我会除以 100 四舍五入 然后再次相乘 int initial int rounded int Mat
  • WPF 画布 VisibilityChanged 事件

    我想设置一个事件来运行Visibility在 WPF 上更改Canvas控制 canvas1 VisibleChanged new EventHandler canvas1 VisibleChanged 我已经尝试了上面的方法 但不起作用
  • 如何从嵌套对象生成查询字符串

    我想为我的高级过滤器生成一个查询字符串 我的对象如下所示 searchValue firstName John lastName Doe postalCode 3130 city New York page 1 我正在使用请求参数 http