Wie können wir einen Zustand in Reaktion teilweise aktualisieren?

Question

Ich frage mich, was ist der beste Weg, um einen Zustand einer Komponente in React/React-Native teilweise zu aktualisieren. Anders als die Tatsache, dass ich eine Funktion machen kann, die den aktuellen Zustand annimmt und einen neuen Zustand erstellt und den neuen {key: value} und den vorherigen Zustand zusammenführt. Beispiel:

{ 
     dataStream:[//having data here], 
     formData: { 
     'first_name': 'Richard', 
     'last_name' : 'Barbieri', 
     } 
} 

Ich möchte last_name auf einen anderen Wert aktualisieren. Wenn ich this.setState(formData:{{'last_name':newValue}}) rufe, setzt es das formData-Wörterbuch auf nur Nachname zurück: neuer Wert. Gibt es einen effizienten Weg dazu?

Answer 1

Ich denke, es gibt zwei Dinge, die Sie könnten versuchen:

1. Spread-Betreiber:

this.setState({formData: {...this.state.formData, "last_name" : newValue } });

oder

2. Nimm aktuellen states Vorname und erneut anwenden:

this.setState({ formData: { "first_name": this.state.formData.first_name, "last_name" : newValue } })

Ich bin nicht sicher, ob die erste, aber ich denke, die zweite sollte funktionieren.

Answer 2

Was passiert, ist normal, weil Sie das ganze forData neu zuweisen.

Wenn Sie etwas zu den bestehenden Formulardaten so etwas tun (es gibt viele andere Lösungen ^^)

this.setState({ 
    formData: Object.assign(this.state.formData, { 'last_name': newValue } 
})