Paginierung und Sortierung
Paginierung und Sortierung
Blättern Sie durch große Ergebnislisten und sortieren Sie sie.
Cursor-basierte Paginierung
Listenfelder geben Connections im Relay-Stil zurück. Blättern Sie mit first + after vorwärts oder mit last + before rückwärts und verwenden Sie dabei die Cursor, die pageInfo zurückgibt.
first / afterGibt die ersten N Elemente nach einem Cursor zurück (vorwärts).last / beforeGibt die letzten N Elemente vor einem Cursor zurück (rückwärts).
paginatedIssues.graphql
query ListIssues($orgId: ID!, $first: Int!, $after: Cursor) {
organization(id: $orgId) {
issues(
first: $first
after: $after
orderBy: { field: CREATED_AT, direction: DESC }
) {
totalCount
edges {
cursor
node {
id
friendlyId
title
}
}
pageInfo {
hasNextPage
endCursor
}
}
}
}Aufbau der Connection
Jede Connection stellt eine Liste von edges, ein pageInfo-Objekt und einen totalCount bereit.
edges[].nodeDas Element selbst – fragen Sie innerhalb von node die Felder ab, die Sie brauchen.edges[].cursorEin opaker Cursor, der auf dieses Element zeigt, um von hier aus zu paginieren.pageInfo.hasNextPage / hasPreviousPageOb es in dieser Richtung weitere Elemente gibt.pageInfo.startCursor / endCursorÜbergeben SieendCursorals nächsten after-Wert, um die folgende Seite abzurufen.totalCountGesamtzahl der Elemente über alle Seiten.
ANTWORT
{
"totalCount": 128,
"edges": [
{
"cursor": "Y3Vyc29yOjE5",
"node": { "id": "rprdbtyvc51ys7g7xq9xwra8cm", "friendlyId": 20, "title": "..." }
}
],
"pageInfo": {
"hasNextPage": true,
"endCursor": "Y3Vyc29yOjE5"
}
}Sortierung
Übergeben Sie ein orderBy-Objekt mit einem field und einer direction. Welche Felder verfügbar sind, hängt von der Connection ab.
orderBy.fieldDas Feld, nach dem sortiert wird. Zum BeispielCREATED_AT.orderBy.directionASCfür aufsteigend oderDESCfür absteigend.
orderBy.graphql
issues(orderBy: { field: CREATED_AT, direction: DESC })