Wie wird der Helper "Immutability" zum Aktualisieren eines verschachtelten Objekts in einem Array verwendet?

Question

Innendruckminderer, ein Statusobjekt gegeben:

var state = { 
     "data": [{ 
      "subset": [{ 
       "id": 1 
      }, { 
       "id": 2 
      }] 
     }, { 
      "subset": [{ 
       "id": 10 
      }, { 
       "id": 11 
      }, { 
       "id": 12 
      }] 
     }] 
    } 

Wie man sehen kann, sind die Daten eine verschachtelte Array mit Arrays in jedem seiner Elemente.

Bekannt, dass action.indexToUpdate ein Index für Daten sein wird, möchte ich Daten [action.indexToUpdate] .subset programmgesteuert auf ein neues Array aktualisieren. Zum Beispiel, wenn action.indexToUpdate = 0, dann werden die Daten [0] wird von

[{"id":1},{"id":2}] 

zu

[{"id":4},{"id":5}] 

Um dies zu tun, aktualisiert werden, ich habe:

let newSubset = [{"id":4},{"id":5}] 
let newState = update(state.data[action.indexToUpdate], { 
       subset: { 
        newSubset, 
       }, 
      }) 

Aber wenn ich dies ausgeführt habe, gibt es einen Fehler zurück:

TypeError: value is undefined 

auf der Update-Datei.

Ich habe die Reaktion Ducomentation hier angesehen: https://facebook.github.io/react/docs/update.html, aber ich konnte nicht wirklich herausfinden, wie es geht. Bitte beraten!

Answer 1

Ihr Update wird wie folgt aussehen

var obj = {"state" : { 
    "data": [{ 
     "subset": [{ 
      "id": 1 
     }, { 
      "id": 2 
     }] 
    }, { 
     "subset": [{ 
      "id": 10 
     }, { 
      "id": 11 
     }, { 
      "id": 12 
     }] 
    }] 
}} 
return update(obj, { 
    "state" : { 
     "data": { 
      [action.indexToUpdate]: { 
      "subset": { 
       $set: [newSubset] 
      } 
      } 
     } 
    } 
}) 

Falls es andere Felder in Teilmenge, aber Sie nur auf die Änderung wollen die Felder in bestimmten Index andere Tasten enthält, würden Sie schreiben

return update(obj, { 
    "state" : { 
     "data": { 
      [action.indexToUpdate]: { 
      "subset": { 
       [id]: {$merge: newSubset} 
      } 
      } 
     } 
    } 
})