how to update a object state?

Question

i have an object like this :

const [mile, setMile] = useState({
    AL: 0,
    AK: 0,
    AR: 0,
    CA: 0,
    CA: 0,
    CT: 0,
    DE: 0,
    DC: 0,
    FL: 0,
    GA: 0,
    HI: 0,
    ID: 0,
    IL: 0,
    IN: 0,
    IA: 0,
    KS: 0,
    KY: 0,
    LA: 0,
    ME: 0,
    MA: 0,
)};

and I receive an array of objects like in the image: Second object

i want to calculate miles traveled in every state :

something like that , but i don't know how to split mile object , i tried Object.entries , but failed

secondObject.map(row =>{
 if (mile.key === row.state)
 {
  mile.value += row.Miles
 }

Your closing brackets are in reverse order, should close the object with } then close the hook with ); — Mainly Karma, Apr 28 '21 at 14:07

score 0 · Answer 1 · answered Apr 28 '21 at 14:09

0

Have you tried this:

secondObject.map(row =>{
 if (mile.hasOwnProperty(row.state)){
  mile[row.state] += row.Miles
 }
});

answered Apr 28 '21 at 14:09

kunal panchal

798
5
21

score 0 · Accepted Answer · answered Apr 28 '21 at 14:19

Use setState(prev => return newValue). When you update object, you have to be careful to return new object.

setMile(prev => {
  // your can't update prev itself so make a copy
  const newMile = Object.assign({}, prev)
  secondObject.map(row => {
    if (newMile.hasOwnProperty(row.state) {
      newMile[row.state] += row.Miles
    }
  })
  return newMile  
})

Related
Updating an object with setState in React
https://reactjs.org/docs/state-and-lifecycle.html

how to update a object state?

2 Answers2