Skip to main content

Class: ConvexReactClient<API>

react.ConvexReactClient

A Convex client for use within React.

This loads reactive queries and executes mutations over a WebSocket.

Type parameters

NameTypeDescription
APIextends GenericAPIThe API of your application, composed of all Convex queries and mutations. npx convex codegen generates this type in convex/_generated/react.ts.

Constructors

constructor

new ConvexReactClient<API>(address, options?)

Type parameters

NameType
APIextends GenericAPI

Parameters

NameTypeDescription
addressstringThe url of your Convex deployment, typically from the origin property of a convex.json config file, E.g. https://small-mouse-123.convex.cloud.
options?ReactClientOptionsSee ReactClientOptions for a full description.

Methods

setAuth

setAuth(token): void

Set the authentication token to be used for subsequent queries and mutations. Should be called whenever the token changes (i.e. due to expiration and refresh)

Parameters

NameTypeDescription
tokenstringJWT-encoded OpenID Connect Identity Token

Returns

void


clearAuth

clearAuth(): void

Clear the current authentication token if set.

Returns

void


watchQuery

watchQuery<Name>(name, ...args): Watch<NamedQuery<API, Name>>

Construct a new Watch on a Convex query function.

Most application code should not call this method directly. Instead use the useQuery hook generated by npx convex codegen.

Type parameters

NameType
Nameextends string | number | symbol

Parameters

NameTypeDescription
nameNameThe name of the query function.
...argsParameters<NamedQuery<API, Name>>The arguments to the query.

Returns

Watch<NamedQuery<API, Name>>

The Watch object.


mutation

mutation<Name>(name): ReactMutation<API, NamedMutation<API, Name>>

Construct a new ReactMutation.

Type parameters

NameType
Nameextends string | number | symbol

Parameters

NameTypeDescription
nameNameThe name of the Mutation.

Returns

ReactMutation<API, NamedMutation<API, Name>>

The ReactMutation object with that name.


close

close(): Promise<void>

Close any network handles associated with this client and stop all subscriptions.

Call this method when you're done with a ConvexReactClient to dispose of its sockets and resources.

Returns

Promise<void>

A Promise fulfilled when the connection has been completely closed.