JSON对象更新给出了奇怪的结果

Question

您好我正在更新一个具有内部数组的json对象，并且每个数组对象都有id元素。基于id元素，我更新了一个与inout id匹配的元素，但它正在修改多个对象。我的源代码和控制台日志如下所示，这将有助于理解问题。

功能

updateUserData(event,id){
    var elementName=event.target.name;
    console.log('id='+id+', element name='+elementName);
    var userData=this.state.user_data;
    console.log('User Data before change ='+JSON.stringify(userData));
    for(var i=0;i<userData.sports.length;i++){
       for(var j=0; j<userData.sports[i].ticket_detail.length;j++){
           if(userData.sports[i].ticket_detail[j].id==id){
               for(var k=0;k<userData.sports[i].ticket_detail[j].ticket.length;k++){
                   if(userData.sports[i].ticket_detail[j].ticket[k].paramname==event.target.name){
                       userData.sports[i].ticket_detail[j].ticket[k].value=event.target.value;
                      console.log('user data after change ='+JSON.stringify(userData));
                       this.setState({user_data:userData});
                       return;
                   }
               }
           }
       }
   }
  }

控制台日志

value=h

id=0, element name=name

User Data before change =

  

{“total_tickets”：3，“total_amount”：2124，“htmlid_counter”：3，“sports”：[{“name”：“Badminton”，“ticket_detail”：[{“cat”：“Men Singles” “formid”：102， “票”：[{ “标记”： “名称：”， “PARAMNAME”： “名称”， “类型”： “文本”， “值”： “”}，{ “标签” ： “电子邮件”， “PARAMNAME”： “电子邮件”， “类型”： “文本”， “值”： “”}，{ “标签”： “电话：”， “PARAMNAME”： “手机”，“类型“：” 文本 “ ”值“： ”“}]， ”ID“：0}，{ ”猫“：” 男人   光棍节 “ ”formid“：102， ”票“：[{ ”标签“： ”姓名：“， ”PARAMNAME“： ”姓名“， ”类型“： ”文本“， ”值“： ”“}，{”标签 “：” 电子邮件”， “PARAMNAME”： “电子邮件”， “类型”： “文本”， “值”： “”}，{ “标签”： “电话：”， “PARAMNAME”： “手机”， “类型”： “文本”， “值”： “”}]， “ID”：1}，{ “猫”：“男人   光棍节 “ ”formid“：102， ”票“：[{ ”标签“： ”姓名：“， ”PARAMNAME“： ”姓名“， ”类型“： ”文本“， ”值“： ”“}，{”标签 “：” 电子邮件”， “PARAMNAME”： “电子邮件”， “类型”： “文本”， “值”： “”}，{ “标签”： “电话：”， “PARAMNAME”： “手机”， “类型”： “文本”， “值”： “”}]， “ID”：2}]}，{ “名称”： “卡罗姆”， “ticket_detail”：[]}]， “tournament_id”：1}

user data after change = 

  

{“total_tickets”：3，“total_amount”：2124，“htmlid_counter”：3，“sports”：[{“name”：“Badminton”，“ticket_detail”：[{“cat”：“Men Singles” “formid”：102， “票”：[{ “标记”： “名称：”， “PARAMNAME”： “名称”， “类型”： “文本”， “值”： “H”}，{“标签“：” 电子邮件 “ ”PARAMNAME“： ”电子邮件“， ”类型“： ”文本“， ”值“： ”“}，{ ”标签“： ”电话：“， ”PARAMNAME“： ”手机“，”键入 “：” 文本 “ ”值“： ”“}]， ”ID“：0}，{ ”猫“：” 男人   单打”， “formid”：102， “票”：[{ “标记”： “名称：”， “PARAMNAME”： “名称”， “类型”： “文本”， “值”： “H”}，{ “标签”： “电子邮件”， “PARAMNAME”： “电子邮件”， “类型”： “文本”， “值”： “”}，{ “标签”： “电话：”， “PARAMNAME”： “手机” “类型”： “文本”， “值”： “”}]， “ID”：1}，{ “猫”：“男人        单打”， “formid”：102， “票”：[{ “标记”： “名称：”， “PARAMNAME”： “名称”， “类型”： “文本”， “值”： “H”}，{ “标签”： “电子邮件”， “PARAMNAME”： “电子邮件”， “类型”： “文本”， “值”： “”}，{ “标签”： “电话：”， “PARAMNAME”： “手机” “类型”： “文本”， “值”： “”}]， “ID”：2}]}，{ “名称”： “卡罗姆”， “ticket_detail”：[]}]， “tournament_id”：1 }

你可以从abobe json看到，即使输入id = 0，但是修改了id为0,1和2的json对象。有人可以帮我解决这个问题。

Answer 1

您在每次迭代时都在执行异步setState。这可能就是为什么你会得到一个奇怪的结果。

你必须建立一个新阵列，然后，在你的阵列成为你最终想要的状态后，你可以这样做：

this.setState({ user_data: newArray })

Answer 2

我发现了这个问题。这个问题正在发生，因为数组的每个元素都是havinv对公共元素的引用。这就是我修改其中任何一个的原因，所有这些都被修改了。