fair-rose

zodValidator in Route.useSearch return different types

According to this https://tanstack.com/router/latest/docs/framework/react/guide/search-params#zod I should be able to access my variables with Route.useSearch() but whenever i do it, it gives me the types of parse, input and output. Is this normal?

Search Params | TanStack Router React Docs

Similar to how TanStack Query made handling server-state in your React applications a breeze, TanStack Router aims to unlock the power of URL search params in your applications. Why not just use URLSe...

6 Replies

sensitive-blue•8mo ago

how are you using it? zodValidator also shouldn't be necessary if you're using zod 3.24, it supports standard schema now

fair-roseOP•8mo ago

i was using has in the docs. but maybe is because of the new version that has that problem thanks for this it still doesnt work this is what i'm doing:

import { getAbsencesListParamsSchema } from "@/services/admin/hr/adminAbsencesQueries";
import { PaginationParamsSchema } from "@/services/servicesSchemas";
import { createFileRoute } from "@tanstack/react-router";

export const Route = createFileRoute("/_authenticated/admin/hr/absences/_absences/")({
  validateSearch: () => {
    const schema = getAbsencesListParamsSchema.merge(PaginationParamsSchema);
    return schema;
  },
});

import { getAbsencesListParamsSchema } from "@/services/admin/hr/adminAbsencesQueries";
import { PaginationParamsSchema } from "@/services/servicesSchemas";
import { createFileRoute } from "@tanstack/react-router";

export const Route = createFileRoute("/_authenticated/admin/hr/absences/_absences/")({
  validateSearch: () => {
    const schema = getAbsencesListParamsSchema.merge(PaginationParamsSchema);
    return schema;
  },
});

sensitive-blue•8mo ago

yeah, you have a function that returns a schema pass the schema directly instead validateSearch: getAbsencesListParamsSchema.merge(PaginationParamsSchema)

fair-roseOP•8mo ago

thanks, i actually thought it would be the same

sensitive-blue•8mo ago

the validator can be: - a function that receives the data, validates the data, and returns it - a standard schema that receives the data, validates the data, and returns it you made a function that receives the data and returns a schema 😄

fair-roseOP•8mo ago

thanks a lot for this. you saved me a lot of time

Gaming

Programming

zodValidator in Route.useSearch return different types

Did you find this page helpful?