Heim >Web-Frontend >js-Tutorial >Wie aktualisiere ich ein verschachteltes Objekt im Status mithilfe von „setState'?

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

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-11-04 03:34:30298Durchsuche

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>

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

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

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>

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!

Stellungnahme:
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