时间戳

首页 > 解决方案 > 反应最终表单拆分字段值

javascript - 反应最终表单拆分字段值

问题描述

我有一个带有反应最终形式的反应和还原应用程序，其中我有一个名为“汽车”的字段，它是一个选择，如果数据脏，间谍会触发一个提交事件。值和东西都很好，但我需要将其拆分为类型，以便表单返回的内容coupe: ['BMW'], sedan: ['Audi']不仅仅是具有值的字段名称，例如cars: ['BMW', 'Audi']

{
  type: "Coupe"
  value: "BMW"   
},
{
  type: "Sedan"
  value: "Audi"   
}

也许有人建议如何改变它以及何时在内部反应最终形式？还是应该在减速器或传奇中完成？

标签： javascriptreactjsreact-final-form

解决方案

假设您将表单数据设为

[
    {
        type: "Coupe",
        value: "BMW"
    }, {
        type: "Sedan",
        value: "Audi"
    }
]

你需要把type值变成键名，所以你得到

[{ coupe: 'BMW'}, {sedan: 'Audi'}]

您可以使用Array.prototype.map()（在您的提交处理程序、reducer 或任何对您更有效的地方）：

const formData = [{type:"Coupe",value:"BMW"},{type:"Sedan",value:"Audi"}],

      remappedData = formData.map(({type,value}) => 
        ({[type.toLowerCase()]: value}))
      
console.log(remappedData)
.as-console-wrapper{min-height:100%;}

推荐阅读