GraphQL-fragments: named, inline en type conditions | We.Inc
Bouw GraphQL-fragments in een live querybuilder: named fragments voor hergebruik, inline fragments voor unions en interfaces, type conditions, __typename en variabelen.
Een GraphQL-fragment is een benoemde, herbruikbare set velden voor één type, geschreven als fragment Name on Type en in een query opgenomen met ...Name. Een inline fragment, geschreven als ... on Type, heeft geen naam en selecteert alleen velden als het resultaat dat concrete type is. Zo bevraagt u unions en interfaces.
Vormen van fragments
Vorm
Syntax
Gebruik het voor
Named fragment
fragment UserCard on User { ... }
Eén veldenlijst delen tussen queries
Spread
...UserCard
De velden van een named fragment opnemen
Inline fragment
... on Photo { url }
Velden van één lid van een union of interface
Inline zonder type
... @include(if: $full) { bio }
Een directive toepassen op een groep velden
Typenaam
__typename
Leden van een union uit elkaar houden in de response
Vink in de builder de velden aan die u wilt en hij schrijft de query voor u, één keer met een named fragment en één keer met de velden inline, zodat u ziet dat ze dezelfde data opvragen. Zet de optie voor zoekresultaten aan om inline fragments over een union toe te voegen.
Vink de User-velden aan die de kaart op uw scherm toont.
Kies of de velden in een named fragment komen of direct in de query.
Zet zoekresultaten aan om een union-veld toe te voegen met een inline fragment per lidtype.
Kopieer de query en voer hem uit op een schema dat deze types heeft.
Vernoem fragments naar de component die ze gebruikt, zoals UserCard of PostRow, zodat elk deel van het scherm zijn eigen databehoefte aangeeft.
Voeg altijd __typename toe als u selecteert uit een union of interface; uw code heeft het nodig om te weten welk lid het kreeg.
Fragments kunnen de variabelen van de operatie lezen, dus een veld in een fragment kan een argument krijgen zoals size: $avatarSize.
Een fragment mag zichzelf niet spreaden, direct of via een ander fragment. De validatie wijst de cyclus af voordat er iets wordt uitgevoerd.
Veelgestelde vragen
Maken fragments responses kleiner?
Nee. Een fragment is een schrijfhulpmiddel voor de query. De server vouwt het uit en de response ziet er precies zo uit alsof u de velden had uitgetypt. Als twee spreads hetzelfde veld selecteren, verschijnt het één keer.
Wanneer moet ik een inline fragment gebruiken?
Als een veld een union of interface teruggeeft en u velden nodig hebt die alleen sommige lidtypes hebben. graphql.org laat dit zien met een hero die een Droid met primaryFunction of een Human met height kan zijn.
Kan een fragment op een ander type worden gebruikt?
Alleen waar het van toepassing kan zijn. Een fragment op een interface kan worden gespreid binnen elk objecttype dat die interface implementeert, maar een fragment op User binnen een Post-selectie faalt bij de validatie.
Waar staan fragments in het document?
Op het hoogste niveau van het document, naast de operaties, in willekeurige volgorde. Elk gedefinieerd fragment moet worden gebruikt, anders wijst de server het document af als ongeldig.
Named fragments voor hergebruik
Stel dat een profielkop, een reactie en een ledenlijst allemaal een naam en een avatar tonen. Die velden drie keer typen vraagt om verschillen: één kopie krijgt een veld dat de andere missen. Een fragment op User bevat de lijst één keer en elke query spreidt het.
Apps op basis van componenten gaan nog verder. Elke component declareert het fragment dat hij nodig heeft en de paginaquery spreidt de fragments van de componenten die hij rendert, zodat de databehoefte naast de code staat die de data gebruikt.
Inline fragments en type conditions
Het deel on Type is de type condition. Bij een named fragment geeft die aan bij welk type de velden horen. Bij een inline fragment binnen een union-veld zorgt die ervoor dat de velden alleen gelden als het object dat type is.
Een zoekopdracht die gebruikers, berichten en foto's teruggeeft, is het klassieke geval. De selectie bevat ... on User, ... on Post en ... on Photo, elk met eigen velden, en __typename vertelt de client welke tak elk resultaat nam.
Schema dat de builder gebruikt
Een union voor zoekresultaten
SearchResult kan een User of een Photo zijn, dus een selectie erop heeft inline fragments nodig om velden van elk lid te bereiken.
Een union-response lezen
Wat de zoekopdracht teruggeeft
Elk item bevat alleen de velden van zijn eigen tak, plus __typename.
Vertakken op __typename
De typenaam is de veilige manier om de leden uit elkaar te houden; controleren op een veld kan breken als een type dat veld later krijgt.
Querybuilder voor fragments
Te selecteren User-velden
Een named fragment gebruiken (UserCard)
Zoekresultaten toevoegen (union met inline fragments)