user8779054
user8779054

Reputation: 183

Update objects within an array

Original array (form[id].values.sections) made up of different objects

(3) [{…}, {…}, {…}]
    1. 0: 
        1. attachments: Array(0)
            1. length: 0
            2. [[Prototype]]: Array(0)
        2. body: "" // How do i update the values here without the original array being converted into an object
        3. [[Prototype]]: Object
    2. 1: {body: '', attachments: Array(0)}
    3. 2: {body: '', attachments: Array(0)}
    4. length: 3
    5. [[Prototype]]: Array(0)

If i use the following method to update body, it turns into an object as shown below

        updatedSections = {
          ...form[id].values.sections,
          0: {
            body: contentBody, attachments: form[id].values.sections[0].attachments,
          },
        };

updatedSection becomes an object.

{0: {…}, 1: {…}, 2: {…}}
    1. 0: 
        1. attachments: Array(0)
            1. length: 0
            2. [[Prototype]]: Array(0)
        2. body: "<p>Content update here</p>"
        3. [[Prototype]]: Object
    2. 1: {body: '', attachments: Array(0)}
    3. 2: {body: '', attachments: Array(0)}
[[Prototype]]: Object

Upvotes: 0

Views: 67

Answers (2)

Haritha Senevirathne
Haritha Senevirathne

Reputation: 155

Yes it becomes an object. Because updatedSections is an object. (you have initialize it with {}).

  updatedSections = { // <-- here
      ...form[id].values.sections,
      0: {
        body: contentBody, attachments: form[id].values.sections[0].attachments,
      },
    }; // <-- here

Below is the correct way to access body property in the array.

form[id].values.sections[0].body = <your_new_content>;

If you don't want to update the original array directly, make a copy of the sections array and update the desired properties in it. Hope this makes sense.

Upvotes: 1

Nick
Nick

Reputation: 147166

You've converted your array into an object by using

updatedSections = { ... }

If you want it to remain an array, you need to use array notation e.g.

updatedSections = [
  {
     body: contentBody, 
     attachments: form[id].values.sections[0].attachments,
  },
  ...form[id].values.sections.slice(1)
]

Upvotes: 1

Related Questions