使用trpc.useContext()使数据无效导致无限循环。

huangapple go评论58阅读模式
英文:

Invalidating data with trpc.useContext() causing a infinite loop

问题

The issue seems to be related to the invalidation logic within your code. Without a detailed analysis of the entire codebase and the context in which these functions are used, it's challenging to pinpoint the exact problem. You might consider seeking assistance on developer forums or communities where you can share your code for a more thorough review.

英文:

I have am having a problem invalidating my data causing it to run nonstop in a loop and cannot see the reason why it is happening or what I need to do to fix it as I am still new with trpc.

Here is my component where the invalidate is being used:

const ShowUsers = ({ householdId }: ShowUserProps) => {
  const inviteRoute = api.useContext().household;
  
  const getInviteList = api.household.getInviteList.useQuery(
    { householdId },
    {
      onSuccess: () => {
        // void inviteRoute.invalidate(); <-- when uncommented, it runs nonstop
      },
    }
  );

  const deleteInvite = api.invite.deleteInvite.useMutation();

  const { data: sessionData } = useSession();

  return (
    <div>
      <h2>Invited</h2>
      {getInviteList.data &&
        getInviteList.data[0]?.invitedList.map((invite, i) => (
          <div key={i} className="flex gap-3">
            <p>{invite.email}</p>
            {sessionData?.user.role === "ADMIN" && (
              <p onClick={() => deleteInvite.mutate({ email: invite.email })}>
                X
              </p>
            )}
          </div>
        ))}
    </div>
  );
};

and here are the trpc functions being used on the backend:

getInviteList: protectedProcedure
    .input(z.object({ householdId: z.string() }))
    .query(async ({ ctx: { prisma }, input }) => {
      const inviteList = await prisma.household.findMany({
        where: {
          householdId: input.householdId,
        },
        select: {

          invitedList: true,
        },
      });

      return inviteList;
    }),

and this is the function that is called to initiate the invalidation:

deleteInvite: protectedProcedure
    .input(z.object({ email: z.string() }))
    .mutation(async ({ ctx, input }) => {
      await ctx.prisma.invite.delete({
        where: {
          email: input.email,
        },
      });
    });

Other than running nonstop, the function works as intended and removed the invite from the list as soon as it is clicked.

Am I needing to somehow target the specific invite being deleted in the invalidation object?

Thanks!

Edit: I changed the invalidation call to

void inviteRoute.getInviteList.invalidate();

to target the specific route but I am still getting the same problem.

答案1

得分: 0

我意识到我在错误的函数上运行了无效操作,我应该在deleteInvite调用的onSuccess中调用它,而不是在getInviteList调用中。

英文:

I realized that I was running the invalidation on the wrong function, I should've been calling it onSuccess of the deleteInvite call, not the getInviteList call.

huangapple
  • 本文由 发表于 2023年4月20日 02:58:04
  • 转载请务必保留本文链接:https://go.coder-hub.com/76057979.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定