代码之家 › 专栏 › 技术社区 › Tyssen

将表单数据转换为多维数组

axios forms javascript

Tyssen · 技术社区 · 2 年前

我有一个表单,其字段如下 name email other[a] other[b] 它是通过AJAX提交的。目前,在使用Axios发布之前准备数据的脚本会这样做

const data = Array.from(new FormData(this.form).entries()).reduce((memo, pair) => ({
    ...memo,
    [pair[0]]: pair[1],
}), {});

它产生

  {
     "name":"X",
     "email":"Y",
     "other[a]":"A",
     "other[b]":"B",
  }

但它需要

  {
     "name":"X",
     "email":"Y",
     "other": {
       "a": "A",
       "b": "B"
     }
  }

我需要做什么才能 other 字段变成嵌套数组?

2 回复 | 直到 2 年前

Reihandio 2 年前

要将其他字段转换为嵌套对象,可以修改数据准备过程。您需要拆分字段名称并相应地构建对象。以下是您可以使用的功能:

function transformFormData(formData) {
  const data = {};

  for (let [key, value] of formData.entries()) {
    if (key.startsWith('other[')) {
      const nestedKey = key.substring(key.indexOf('[') + 1, key.indexOf(']'));
      if (!data['other']) {
        data['other'] = {};
      }
      data['other'][nestedKey] = value;
    } else {
      data[key] = value;
    }
  }

  return data;
}data;
}

使用此功能替换当前的数据准备过程:

const data = transformFormData(new FormData(this.form));

此函数遍历表单数据项,并检查键是否以“other”开头。如果是这样,它将提取嵌套键(如“a”或“b”)并相应地构造对象。否则,它将键值对直接存储在主对象中。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前