在React中使用setState更新复杂JSON对象的函数方法

tf7tbtn2  于 2022-12-24  发布在  React
关注(0)|答案(1)|浏览(216)

我有这个结构数据,我收到的JSON:(我不能修改它,因为在API上工作的不是我),我必须用用户所做的修改来更新JSON文件。

{
    "id": 1269,
    "name": "Fet",
    "firstname": "Boba",
    "contacts": [
        {
            "id": 2,
            "name": "Ema Tal",
        }
    ]
}

我获取JSON并将其放入一个localStorage中,然后更新localStorage并将JSON返回到api以进行更新。
x一个一个一个一个x一个一个二个x
我似乎无法弄清楚它以相同的顺序输出它的方式,并且只替换数据而不添加每个错别字上的新联系人。
我遇到问题是,每次更新该文件时,它都会替换"联系人"中没有的名称,或者在"联系人"中创建新的联系人
替换不在通讯录中的姓名示例

{
    "id": 1269,
    "name": "Ema tal", <-- same not good
    "firstname": "Boba",
    "contacts": [
        {
            "id": 2,
            "name": "Ema Tal", <-- same not good
        }
    ]
}

还有一个例子,说明我在联系人中创建新联系人的意思(那也不好)

{
    "id": 1269,
    "name": "Fet",
    "firstname": "Boba",
    "contacts": [
        {
            "id": 2,
            "name": "Ema Tal",
        },
         "contacts": [
         {
            "id": 2,
            "name": "Ema Tal 2",
          }
    ]
    ]
}

我需要的数据更新完全像这样(同样的方式来。)

{
    "id": 1269,
    "name": "Fet",
    "firstname": "Boba",
    "contacts": [
        {
            "id": 2,
            "name": "Ema Tal updated",
        }
    ]
}
kyks70gy

kyks70gy1#

如果这可以帮助别人,我发现什么适合我,你输入帮助我找到解决方案
因为我有一个包含其他对象数组对象,所以我需要一个像这样的Map。

newValues = user['contacts'].map(section => {
      return ({ ...section, ['name']: e.target.value })
    })

    setUser(prev => ({
      ...prev, contacts:
        newValues
    }));

相关问题