Maak van een voorbeeldantwoord types
Het meeste API-werk begint hetzelfde: je hebt een JSON-antwoord en hebt er een type voor nodig. Plak het antwoord links en rechts staat de bijbehorende TypeScript, klaar voor een .ts-bestand. Er hoeft niets met de hand te worden getypt, en een payload met tien niveaus nesting kost evenveel tijd als een met twee.
Van payload naar declaratiebestand
- Plak je JSON in het linkervak of druk op Voorbeeld om te zien hoe het werkt.
- Stel de naam van het hoofdtype in, bijvoorbeeld
UserofApiResponse. - Kies tussen
interfaceentypeen vink export of alleen-lezen aan als je dat wilt. - Controleer het resultaat rechts. Een syntaxisfout wordt gemeld in plaats van de types.
- Gebruik Kopiëren of .ts downloaden om de code mee te nemen.
Hoe de types worden bepaald
- Strings, getallen, booleans en null worden het bijbehorende TypeScript-type.
- Een geneste object wordt een eigen interface, genoemd naar zijn sleutel in PascalCase. De sleutel
shipping_addressgeeftShippingAddress. - Bij arrays worden alle elementen samengevoegd. Een sleutel die maar in sommige voorkomt, wordt optioneel gemarkeerd met een vraagteken, en waarden van verschillende soorten worden een union zoals
string | number. - Twee objecten met precies dezelfde vorm delen één interface in plaats van twee kopieën te geven.
- Een lege array geeft
unknown[], een leeg object geeftRecord<string, unknown>.
Grenzen van gokken op basis van één voorbeeld
Een voorbeeld kan alleen laten zien wat erin zit. Een veld dat in je voorbeeld altijd gevuld was, kan in productie null zijn, en een getal dat op een id lijkt, kan elders een string zijn. Datums komen binnen als strings en worden dus getypt als string. Behandel de uitvoer als eerste concept en scherp het met de hand aan, of valideer echte antwoorden tijdens het draaien als de gegevens van buiten je eigen controle komen.
Je payload blijft privé
De conversie draait in de pagina. Productieantwoorden, tokens en persoonsgegevens in een geplakt voorbeeld worden niet naar een server gestuurd, dus je kunt het gerust met echte gegevens gebruiken.