Array-Push gibt die Länge zurück
this.state.myArray.push('new value')
Gibt die Länge des erweiterten Arrays anstelle des Arrays selbst zurück. Array.prototype.push () .
Ich denke, Sie erwarten, dass der zurückgegebene Wert das Array ist.
Unveränderlichkeit
Es scheint eher das Verhalten von React zu sein:
Mutieren Sie diesen Zustand NIEMALS direkt, da der anschließende Aufruf von setState () die von Ihnen vorgenommene Mutation ersetzen kann. Behandle diesen Zustand so, als wäre er unveränderlich. React.Component .
Ich denke, du würdest es so machen (nicht mit React vertraut):
var joined = this.state.myArray.concat('new value');
this.setState({ myArray: joined })
console.log(this.state.myArray)
es immer einer dahinter. Irgendeine Idee warum?setState()
Änderungen am Komponentenstatus in die Warteschlange stellen und React mitteilen, dass diese Komponente und ihre untergeordneten Komponenten mit dem aktualisierten Status neu gerendert werden müssen. Ich denke, es wird in diesem Moment direkt nach dem Einstellen einfach nicht aktualisiert. Könnten Sie bitte ein Codebeispiel posten, in dem wir sehen können, welchen Punkt Sie setzen und protokollieren, bitte?.concat('new value');
sollte sein.concat(['new value']);
concat()
Methode perfekt gültig . Siehe: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… ( Arrays und / oder Werte, die zu einem neuen Array verkettet werden sollen. )Mit es6 geht es folgendermaßen:
Syntax verbreiten
quelle
this.props
undthis.state
können asynchron aktualisiert werden, sollten Sie sich bei der Berechnung des nächsten Status nicht auf deren Werte verlassen." Wenn Sie ein Array ändern, da das Array bereits als Eigenschaft von existiertthis.state
und Sie auf seinen Wert verweisen müssen, um einen neuen Wert festzulegen, sollten Sie die Form verwendensetState()
, die eine Funktion mit dem vorherigen Status als Argument akzeptiert. Beispiel:this.setState(prevState => ({ myArray: [...this.state.myArray, 'new value'] }));
Siehe: reactjs.org/docs/…In späteren React-Versionen wird empfohlen, beim Ändern von Status eine Updater-Funktion zu verwenden, um Rennbedingungen zu vermeiden:
Schieben Sie die Zeichenfolge an das Ende des Arrays
Schieben Sie den String an den Anfang des Arrays
Objekt an das Ende des Arrays schieben
Objekt an den Anfang des Arrays schieben
quelle
this.setState((prevState) => ({ myArray: [values, ...prevState.myArray], }));
Sie sollten den Status überhaupt nicht betreiben. Zumindest nicht direkt. Wenn Sie Ihr Array aktualisieren möchten, sollten Sie Folgendes tun.
Es ist nicht wünschenswert, direkt am Statusobjekt zu arbeiten. Sie können sich auch die Unveränderlichkeitshilfen von React ansehen.
https://facebook.github.io/react/docs/update.html
quelle
.slice()
, um ein neues Array zu erstellen und Unveränderlichkeit zu bewahren. Danke für die Hilfe.Mit der
.concat
Methode können Sie eine Kopie Ihres Arrays mit neuen Daten erstellen:Aber Vorsicht vor dem besonderen Verhalten der
.concat
Methode beim Übergeben von Arrays -[1, 2].concat(['foo', 3], 'bar')
wird dazu führen[1, 2, 'foo', 3, 'bar']
.quelle
Dieser Code funktioniert für mich:
quelle
fetch(`api.openweathermap.org/data/2.5/forecast?q=${this.searchBox.value + KEY} `) .then( response => response.json() ) .then( data => { this.setState({ reports: this.state.reports.push.apply(this.state.reports, data.list)}); });
this.state = { reports=[] }
... bitte ich möchte wissen, was ich falsch macheReact-Native
Wenn Sie auch möchten, dass Ihre Benutzeroberfläche (dh Ihre FlatList) auf dem neuesten Stand ist, verwenden Sie PrevState: Wenn der Benutzer im folgenden Beispiel auf die Schaltfläche klickt, wird der Liste ein neues Objekt hinzugefügt (sowohl im Modell als auch in der Benutzeroberfläche )
quelle
Auf folgende Weise können wir die Objekte überprüfen und aktualisieren
quelle
Hier können Sie das Objekt nicht in ein Statusarray wie dieses verschieben. Sie können wie gewohnt im normalen Array pushen. Hier müssen Sie den Zustand einstellen,
quelle
Wenn Sie nur versuchen, den Status so zu aktualisieren
Betrachten Sie diesen Ansatz
Grundsätzlich schreibt prevState this.state für uns.
quelle