Theo's Typesafe Cult•2y ago

tRPC mutation and data

Hi, so with tRPC I'm creating an account, which I have some checks on the function to see if an account with the same email already exists. With it, I'm returning a status code and message, and the same for if a user is successfully created. However, I am having trouble with obtaining this data on the frontend. I will either get a null/undefined object, or I will get the data but it will be from the last function call, not the current one. Currently my code looks something like this:

// frontend

mutation.mutate({
  email: email,
  name: username,
  password: password,
});
console.log(mutation.data);

// frontend

mutation.mutate({
  email: email,
  name: username,
  password: password,
});
console.log(mutation.data);

// backend
if (exists) {
  return {
    status: "409",
    message: "A user with that email address already exists",
  };
}

// create the user
return {
  status: "201", 
  message: "User created successfully",
};

// backend
if (exists) {
  return {
    status: "409",
    message: "A user with that email address already exists",
  };
}

// create the user
return {
  status: "201", 
  message: "User created successfully",
};

3 Replies

0sir1sOP•2y ago

thats what it looks like, it's printing out the data but then it's doing the mutation

Neto•2y ago

mutateAsync should give you a promise with the resolved value but you should have in datathe result of the mutation

Neto•2y ago

https://tanstack.com/query/v4/docs/react/guides/mutations

Mutations | TanStack Query Docs

Unlike queries, mutations are typically used to create/update/delete data or perform server side-effects. For this purpose, TanStack Query exports a useMutation hook. Here's an example of a mutation that adds a new todo to the server:

Gaming

Programming

tRPC mutation and data