Question

在几个固定选项旁边，我有一个名为other[index]的可变数量的yes / no radio输入。使用$(form).serializeArray()得到一个名称/值对象数组。使用reduce可以将em缩减为实际对象。

const seializedForm = $(event.currentTarget.form).serializeArray();

const gdpr = seializedForm.reduce((aggragation, option) => { 
    return {
        ...aggragation,
        [option.name]: option.value === 'true'
}}, {});

这里的问题是结果不完全是我所需要的：

{
  "canNotify":true,
  "canContact":true,
  "canProcess":true,
  "other[0]":false,
  "other[1]":true,
  "other[2]":false
}

我希望它是

{
  "canNotify":true,
  "canContact":true,
  "canProcess":true,
  "other": [
      false,
      true,
      false
  ]
}

有什么建议吗？

Answer 1

对于每个名称-删除方括号，如果键已存在于数组中，则使用数组扩展将值合并到数组中：

const serializedForm = [{"name":"canNotify","value":"true"},{"name":"canContact","value":"true"},{"name":"canProcess","value":"false"},{"name":"other[0]","value":"false"},{"name":"other[1]","value":"true"},{"name":"other[2]","value":"false"}];

const gdpr = serializedForm.reduce((aggragation, { name, value }) => {
  const isArray = name.includes('[');
  const key = name.replace(/\[.+\]/g, '');
  const val = value === 'true';

  return {
    ...aggragation,
    [key]: isArray ? [...aggragation[key] || [], val] : val
  };
}, {});

console.log(gdpr);

Answer 2

在不知道完整对象结构是什么样的情况下，如果名称包含数组语法，为什么不只是在返回之前检查名称所包含的内容。 []或字符串other，那么我们可以假定它是其他表单收集结构的一部分吗？

const seializedForm = $(event.currentTarget.form).serializeArray();

const gdpr = seializedForm.reduce((aggragation, option) => {
    if (isInArrayOfOptions(option)) {
        return {
            ...aggragation,
            /* Return a new array combining the current with the next option.value*/
            'other': [...aggragation.other, ...[option.value === 'true']]
        }
    }
    return {
        ...aggragation,
        [option.name]: option.value === 'true'
    }
}, {});

字符串到索引属性

2 个答案: