Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie aktualisiere ich ein verschachteltes Objekt im Status mithilfe von „setState'?

Mary-Kate Olsen
Freigeben: 2024-11-04 03:34:30
Original
267 Leute haben es durchsucht

How to Update a Nested Object in State Using `setState`?

State.item[1] im Status mit setState aktualisieren

In dieser Situation versuchen Sie, ein Objekt innerhalb eines Objekts zu aktualisieren in Ihrem Bundesstaat mit setState. Um den Status korrekt zu aktualisieren, müssen Sie eine Kopie des gesamten Statusobjekts erstellen, die Kopie ändern und dann den Status auf die aktualisierte Kopie festlegen.

So können Sie state.item[1] mit aktualisieren setState:

<code class="javascript">// 1. Make a shallow copy of the items
let items = [...this.state.items];

// 2. Make a shallow copy of the item you want to mutate
let item = {...items[1]};

// 3. Replace the property you're interested in
item.name = 'newName';

// 4. Put it back into our array. N.B. we *are* mutating the array here, 
//    but that's why we made a copy first
items[1] = item;

// 5. Set the state to our new copy
this.setState({items});</code>
Nach dem Login kopieren

Sie können die Schritte 2 und 3 kombinieren, wenn Sie möchten:

<code class="javascript">let item = {
    ...items[1],
    name: 'newName'
}</code>
Nach dem Login kopieren

Oder Sie können das Ganze in einer Zeile erledigen:

<code class="javascript">this.setState(({items}) => ({
    items: [
        ...items.slice(0,1),
        {
            ...items[1],
            name: 'newName',
        },
        ...items.slice(2)
    ]
}));</code>
Nach dem Login kopieren

Hinweis: In diesen Beispielen haben wir angenommen, dass es sich bei „items“ um ein Array handelt. Wenn items ein Objekt wäre, würden Sie ähnliche Aktualisierungen an den Objekteigenschaften vornehmen.

Denken Sie daran, dass Sie bei Verwendung von setState immer eine Kopie des vorherigen Status erstellen sollten, bevor Sie ihn ändern, um sicherzustellen, dass Sie nicht versehentlich mutieren das ursprüngliche Zustandsobjekt.

Das obige ist der detaillierte Inhalt vonWie aktualisiere ich ein verschachteltes Objekt im Status mithilfe von „setState'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage