Update a selected property from react state of objects with arrays

Question

Assume that this state has initial data like this

const [options, setOptions] = useState({
  ProcessType: [
    { value: 1, label: 'Type1' }, { value: 2, label: 'Type2' }
  ],
  ResponsibleUser: [
    { value: 1, label: 'User1' }, { value: 2, label: 'User2' }
  ]
});

The following function will be called again and again when a post/put called

Help me to complete the commented area as described there.

const fetchProcesses = async () => {
  await axios.get(`${process.env.REACT_APP_SERVER_BASE_URL}/processes/`)
    .then((result) => {
      /* 
        I want here to clear the existing data in options.ProcessType and
        map result.data as { value: result.data.id , label: result.data.name },....
        and push/concat it into to options.ProcessType but i want to keep the data
        inside options.ResponsibleUser unchanged. 
  
        result.data is an array of objects like this,
        [
          { id: 1 , name: 'Type1', desc : 'desc1', creator: 3, status: 'active' },
          { id: 2 , name: 'Type2', desc : 'desc2', creator: 6, status: 'closed' },
          .....
          .....
        ]
      */
    })
}

Zia ur Rehman · Accepted Answer · 2021-03-23 09:10:56Z

1

Here is a solution

const fetchProcesses = async () => {
    await axios.get(`${process.env.REACT_APP_SERVER_BASE_URL}/processes/`)
      .then((result) => {
        // solution
        setOptions({ResponsibleUser: [...options.ResponsibleUser], ProcessType:  result.data.map(row => ({value: row.id, label: row.name}))})
    })
}

answered Mar 23, 2021 at 9:10

Zia ur Rehman

5754 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Update a selected property from react state of objects with arrays

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related