Weird Fehler in reaktiven nativen ListView

Question

Bitte lesen Sie die vollständige Frage, wie es hilfreich sein kann, dieses Verhalten zu kennen.

Ich habe eine unterteilte ListView, die eine Liste von Aufgaben enthält. Die Listenansicht besteht aus drei Abschnitten (Zuletzt, Später und Zurück). Jede Aufgabe kann eine Liste von Benutzern enthalten, die informiert werden sollen, wenn eine Aufgabe erledigt ist. Eine Aufgabe wird in den Bereich Past verschoben, wenn sie als erledigt markiert ist. Wenn eine Aufgabe markiert ist als getan, unten Dinge stattfinden

1. Mark die Aufgabe, wie sie in der Redux Speicher getan
2. Wenn die Aufgabe Teilnehmer hat,
eine Remote-Benachrichtigung an die Teilnehmer senden

Wenn die Aufgabe wird als erledigt markiert, der Redux-Speicher wird aktualisiert, was ein erneutes Rendern des ListView auslöst. Der zweite Schritt geschieht, nachdem die ListView entsprechend den Protokollen neu gerendert wurde.

Was passiert ist, dass der zweite Schritt mit den Requisiten einer anderen Aufgabe ausgelöst wird und nicht die Aufgabe, die als erledigt markiert wurde. Es ist, als ob die ListView Elemente wiederverwendet wurden und das ListView Element, das zuvor für die Aufgabe verwendet wurde, die als erledigt markiert ist, wird nun für ein anderes Element wiederverwendet und der Rest des Codes wird unter Verwendung der Requisiten für diese andere Aufgabe ausgeführt, die sehr seltsam ist. Unten ist, wie es in dem Code

changeTaskStatus =() => { 
    this.props.dispatch(ActionCreators.markTaskDone(this.props.id)) 

    // A re-render is triggered once the above action is dispatched and the 
    // this.props.id in the next step is not the one that the user marked as done 
    this.props.dispatch(ActionCreators.notifyParticipants(this.props.id)) 
    } 

aussieht Ich werde versuchen, ein Beispielprojekt erstellen, das dieses Problem aufweist. Wenn Sie Informationen zu diesem Verhalten haben, senden Sie eine Antwort oder einen Kommentar.

Answer 1

Sie sollten Daten mit ListView binden wie

<ListView ... renderRow={this.renderList.bind(this)} />

So folgen, wenn nach dem Update-Liste Sie ID in Funktion changeTaskStatus und Update Listview übergeben müssen.

Und Sie können auch separate Aufgabe ID und verwalten sie durch Ihre eigene Logik