Ich habe eine getTracksAbfrage, die Trackdaten abruft und eine Handvoll Argumente zum Sortieren / Filtern verwendet (Limit, Offset, Suche, Sortierung, Reihenfolge). Leider speichert Apollo alle diese Elemente separat zwischen. Wenn ein Element in einer Ansicht gelöscht wird, ändert der Benutzer die Sortierreihenfolge und das gelöschte Element ist noch vorhanden (da es sich im Cache für einen anderen Satz von Argumenten befindet).
Dies ist die getTracksAbfrage zusammen mit dem relevanten Eingabetyp (in meinem serverseitigen AppSync-Schema):
input SelectOptions {
limit: Int
offset: Int
sort: String
order: String
search: String
}
type Query {
getTracks(options: SelectOptions): TrackList!
}
type TrackList {
total: Int!
items: [Track!]!
}
Im Vue-Client sieht die Abfrage folgendermaßen aus:
query GetTracks($options: SelectOptions) {
getTracks(options: $options) {
total
items {
id
name
runtime
createdAt
metadata {
trackNum
trackName
artistName
albumName
year
}
}
}
}
Wenn die Tabelle zum ersten Mal angezeigt wird, werden die Elemente geladen und angezeigt (die Standardsortierreihenfolge wird bei / ab erstellt). Wenn ich nach createdAt / asc sortiere, wird eine Netzwerkanforderung gestellt, um die Ergebnisse abzurufen, und sie werden einwandfrei angezeigt. Wenn ich nun einen der Datensätze lösche und dann erneut nach createdAt / desc sortiere, wird das gelöschte Element angezeigt, da es aus dem Cache gezogen wird.
Gibt es in Apollo keine Möglichkeit, Elemente intelligent durchzugehen und Elemente aus dem Cache zu entfernen (oder hinzuzufügen / zu ändern), obwohl die Abfrage unterschiedliche Argumente enthält? Ich habe die hier dokumentierte@connection Direktive ausprobiert , aber es hat sie nur so gemacht, dass das Sortieren der Tabelle keine Auswirkung hatte (sie würde überhaupt nicht vom Server abgerufen).
Ich stecke völlig fest und bin bereit, das Caching einfach ganz zu deaktivieren, da es in realen Szenarien nicht zu funktionieren scheint. Wie kann ich die Standardrichtlinie cache-and-networkbeibehalten, aber sicherstellen , dass sich meine Tabellen ordnungsgemäß verhalten, wenn Daten geändert werden?
Leider wurde dieses Problem bereits erwähnt, und es gibt keine gute Lösung dafür. Das größte Problem besteht darin, dass weder der Client noch der Cache eine Methode zum Abrufen aller Anforderungen für eine bestimmte Abfrage verfügbar machen. Wenn Sie diese Informationen hätten, könnten Sie die Anforderungen durchlaufen und den Cache entsprechend aktualisieren.
Das nächstbeste, was Sie tun können, ist die Verwendung der Apollo-Link-Watched-Mutation . Über den Link können wir eine oder mehrere Abfragen effektiv identifizieren, die pro Mutation aktualisiert werden müssen. Er verwendet jedoch Operationsnamen, um die Abfragen zu identifizieren (und welche Mutationen sie auslösen sollten). Auf diese Weise müssen Sie nicht einmal die relevanten Variablen kennen, um eine Abfrage zu aktualisieren. Sie müssen lediglich Ihre Vorgänge konsistent benennen.
new WatchedMutationLink(
cache,
{
SaveTodo: {
TodoList: ({ mutation, query }) => {
// update logic here
}
}
}
)
Ein Nachteil dieses Ansatzes ist, dass Sie nicht mehr in der Lage sind, Ihre updateLogik pro Komponente zu definieren . Sie können diese Einschränkung jedoch auch umgehen, indem Sie Mutationen mit unterschiedlichen Namen verwenden.
Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.
Bei Verstößen wenden Sie sich bitte [email protected] Löschen.
Lass mich ein paar Worte sagen