Inofficiell Beta-översättning

Denna sida har översatts av PageTurner AI (beta). Inte officiellt godkänd av projektet. Hittade du ett fel? Rapportera problem →

tRPC-klient

Den "Vanilla" tRPC-klienten låter dig anropa dina API-procedurer som om de vore lokala funktioner, vilket ger en sömlös utvecklingsupplevelse.

ts
import { createTRPCClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from './server';
 
const client = createTRPCClient<AppRouter>({
  links: [httpBatchLink({ url: 'http://localhost:3000' })],
});
 
const bilbo = await client.getUser.query('id_bilbo');
// => { id: 'id_bilbo', name: 'Bilbo' };

ts
import { createTRPCClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from './server';
 
const client = createTRPCClient<AppRouter>({
  links: [httpBatchLink({ url: 'http://localhost:3000' })],
});
 
const bilbo = await client.getUser.query('id_bilbo');
// => { id: 'id_bilbo', name: 'Bilbo' };

När ska du använda Vanilla-klienten?

Du kommer troligen att använda denna klient i två scenarier:

• Med ett frontend-ramverk som saknar officiell integration

• Med en separat backend-tjänst skriven i TypeScript

När ska du INTE använda Vanilla-klienten?

• Även om du kan använda klienten för att anropa procedurer från en React-komponent, bör du vanligtvis använda vår TanStack React Query-integration. Den erbjuder många extra funktioner som hantering av laddnings- och felstatus, cachning samt ogiltigförklaring.

• Vi rekommenderar att du inte använder denna klient vid anrop till procedurer i samma API-instans, eftersom anropet då måste passera genom nätverkslagret. För kompletta rekommendationer om att anropa procedurer i samma API kan du läsa mer här.