Question 244427 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – React update nested object property

I have a React state object (myData) set as below (via React.useState)

{
    myPayloadInfo: myData.myPayloadInfo,
    isOriginDetails: true,
    originSuccessMsg: null
}

myData.myPayloadInfo looks as below

{
    "someVersion": 1,
    "someFlag": false
}

Now, I want to update "someFlag" to true in the overall "myData". How can I do that using the spread operator ?

Tags:

2

Answers


  1. 0

    Since you mentioned that you have used useState, I assume that you have used it as,

    const [myData, setMyData] = useState({
    myPayloadInfo: {
        someVersion: 1,
        someFlag: false
    },
    isOriginDetails: true,
    originSuccessMsg: null
});

    To update the someFlag, You have to do

    setMyData({
  ...myData,
  myPayloadInfo: {
     ...myData.myPayloadInfo,
     someFlag: true
  }
});
    Login or Signup to reply.
  2. 0

    Unless I am missing the point, just spreading the full object, and then digging down to any required specifics should do the job:

    const data = {
  myPayloadInfo: {
    someVersion: 1,
    someFlag: false
  },
  isOriginDetails: true,
  originSuccessMsg: null
}

const newData = { 
  ...data,
  myPayloadInfo: {
    ...data.myPayloadInfo,
    someFlag: true,
  }
}

console.log(newData)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search