Ich bin neu zu Reagieren und ich versuche, ein Data Grid zu machen, es funktioniert jetzt, aber ich fühle mich wie ich es falsch mache, hier sind die Details:Korrekter Weg zum Anheben Zustand in React
Jede Zeile hat mehrere Eingaben (Text, Auswahl, Schaltfläche), und wir haben die Möglichkeit zu löschen, Zeilen einzufügen.
Jetzt habe ich eine GridComponent, die alle Daten als ein Array von Objekt enthalten. Auf macht es, das Objekt zu RowComponent mit einem Griff passieren zu rufen, wenn die Eingabe ändert:
this.state.data.map((rowdata, index) =>
<RowComponent key={rowdata.id} rowdata={rowdata} dataindex={index} handleChange={this.handleChange} />)
Das Problem ist, wenn RowComponent handleChange nennen, die GridComponent die rowIndex verwendet das Objekt zu aktualisieren. Aber es ist langsam und hat ein wenig Verzögerung beim Tippen.
Um dieses Problem zu lösen, deklariere ich dann einen Zustand in RowComponent, um die Daten während der Eingabe zu steuern und nur handleChange on onBlur-Ereignis aufrufen und es funktioniert sehr gut. Aber jetzt habe ich 2 Zustand in der Grid and Row, ist es der richtige Weg zu tun?
Beide Ansätze sollten in Ordnung sein. Wie groß sind die Daten, über die wir sprechen? Ändert sich die ID aus irgendeinem Grund? –
Sie verwenden nichts wie Flussmittel oder Redox? –
@HoriaComan: Es wird nicht zu groß nur neugierig, weil der erste Ansatz langsam ist und der zweite ist die Daten duplizieren. Die ID ist nur für Schlüssel – Tubc