typescript 使用tRPC调用useInfiniteQuery会由于游标而导致TRPCClientError

eoigrqb6 于 2023-04-22 发布在 TypeScript

关注(0)|答案(1)|浏览(116)

我之前用tRPC调用useQuery钩子来获取数据。但是，当我转换到useInfiniteQuery时，发生了TRPCClientError。
这与用于跟踪分页的cursor有关，它没有传递到初始调用中（因为docs不需要）。它在tRPC路由器的过程中声明。
GET请求失败，HTTP响应代码为400。

TRPCClientError: [
  {
    "code": "invalid_type",
    "expected": "string",
    "received": "undefined",
    "path": [
      "cursor"
    ],
    "message": "Required"
  }
]

typescript

来源：https://stackoverflow.com/questions/76020969/calling-useinfinitequery-with-trpc-results-in-a-trpcclienterror-due-to-cursor

1条答案

按热度按时间

n9vozmp41#

这个问题可以通过确保cursor的Zod类型Assert是nullish来解决。对于被请求的第一个页面，它的值是undefined，因为最初没有什么可跟踪的。

import { initTRPC } from '@trpc/server';

export const t = initTRPC.create();

export const appRouter = t.router({
  infinitePosts: t
    .procedure
    .input(z.object({
      someInput: z.string(),
      cursor: z.number().nullish(), // <-- cursor must be nullish
    }))
    .query(({ input }) => {
      const { someInput, cursor } = input;
      /* Some logic to query database... */
      return {
        dbResult,
        nextCursor,
      };
    })
})

赞(0）回复(0）举报 2023-04-22

我来回答

typescript 使用tRPC调用useInfiniteQuery会由于游标而导致TRPCClientError

1条答案

相关问题

热门标签

最新问答