Question

我刚开始使用reactjs并处理表单组件（formsy）。我正在尝试向现有数组元素添加元素，但我无法这样做。以下是我尝试过的以及到目前为止所得到的内容。

JSON对象 -

{
   "details": {
       "someInnerObj": "v3",
       "innerObj": {
           "key1": "",
           "key2": ""
       },
       "ArrayObject": [{
               "type": "sometype",
               "somedesign": {
                   "A": "",
                   "B": "",
                   "C": "",
                   "D": ""
               },
               "somedev": {
                   "a": "",
                   "b": "",
                   "c": "",
                   "d": ""
               }
           }
       ],
       "code": "code",
       "isThis": "true"
   }
}

我想在这里实现的是向ArrayObject添加和元素，如下所示

"ArrayObject": [{
               "type": "sometype",
               "somedesign": {
                   "A": "",
                   "B": "",
                   "C": "",
                   "D": ""
               },
               "somedev": {
                   "a": "",
                   "b": "",
                   "c": "",
                   "d": ""
               }
           },
           {
               "type": "sometype1",
               "somedesing1": {
                   "A1": "",
                   "B1": "",
                   "C1": "",
                   "D1": ""
               },
               "somedev1": {
                   "a1": "",
                   "b1": "",
                   "c1": "",
                   "d1": ""
               }
           }
       ]

我使用json对象的字段值作为新元素 “details.ArrayObject [1]”。但它不是添加新元素，而是创建新密钥，如下所示，并删除现有的 -

"ArrayObject": {
            "[1]": {
                   "type": "sometype1",
                   "somedesing1": {
                       "A1": "",
                       "B1": "",
                       "C1": "",
                       "D1": ""
                   },
                   "somedev1": {
                       "a1": "",
                       "b1": "",
                       "c1": "",
                       "d1": ""
                   }
               }
        }

有人可以帮忙吗？

感谢。

Answer 1

您可以使用spread operator syntax之类的

    const data = {
       "details": {
           "someInnerObj": "v3",
           "innerObj": {
               "key1": "",
               "key2": ""
           },
           "ArrayObject": [{
                   "type": "sometype",
                   "somedesign": {
                       "A": "",
                       "B": "",
                       "C": "",
                       "D": ""
                   },
                   "somedev": {
                       "a": "",
                       "b": "",
                       "c": "",
                       "d": ""
                   }
               }
           ],
           "code": "code",
           "isThis": "true"
       }
    }

    const newData = {
                   "type": "sometype1",
                   "somedesing1": {
                       "A1": "",
                       "B1": "",
                       "C1": "",
                       "D1": ""
                   },
                   "somedev1": {
                       "a1": "",
                       "b1": "",
                       "c1": "",
                       "d1": ""
                   }
               }
               
               
    const res = {
        ...data,
        details: {
            ...data.details,
            ArrayObject: [
              ...data.details.ArrayObject,
              newData
            ]
        }
    }

    console.log(res);

Answer 2

不知道您是否使用detials.ArrayObject[1]作为访问者。 details中有一个拼写错误。

尝试obj["details"]["ArrayObject"][1]直接访问。

如果要添加对象，可以在ArrayObject上使用数组推送，如["details"]["ArrayObject"].push(yourObjectToAdd)。

Answer 3

您需要做的是

添加到数组

var newItem1 = {
               "type": "sometype1",
               "somedesign": {
                   "A": "a1",
                   "B": "b1",
                   "C": "c1",
                   "D": "d1"
               },
               "somedev": {
                   "a": "aa1",
                   "b": "bb1",
                   "c": "cc1",
                   "d": "dd1"
               }
           }
var newItem2 = {
               "type": "sometype2",
               "somedesign": {
                   "A": "a2",
                   "B": "b2",
                   "C": "c2",
                   "D": "d2"
               },
               "somedev": {
                   "a": "aa2",
                   "b": "bb2",
                   "c": "cc2",
                   "d": "dd2"
               }
           }


 var data =
    {
       "details": {
           "someInnerObj": "v3",
           "innerObj": {
               "key1": "",
               "key2": ""
           },
           "ArrayObject": [newItem1,newItem2
           ],
           "code": "code",
           "isThis": "true"
       }
    }

Reactjs：在Json中向数组对象添加元素

3 个答案: