1
  beforeLoad: async ({ params }) => {
2
    // params.postId
3
  },

1
  const { postId } = Route.useParams()

1
  const { postId } = useParams({ strict: false })

1
  beforeLoad: async ({ search }) => {
2
    // search.sort === 'new'
3
  },

1
  const { sort } = Route.useSearch()

1
  const search = useSearch({
2
    strict: false,
3
  })

1
type ProductSearch = {
2
  page: number,
3
  sort: 'newest' | 'price',
4
}
5

6
export const Route = createFileRoute('/shop/products')({
7
  validateSearch: (search: Record<string, unknown>): ProductSearch => {
8
    // サーチパラメータを検証し、型付きの状態に変換します
9
    return {
10
      page: Number(search?.page ?? 1),
11
      sort: (search.sort as ProductSearchSortOptions) || 'newest',
12
    }
13
  },
14
})

1
import { fallback, zodValidator } from '@tanstack/zod-adapter'
2

3
const productSearchSchema = z.object({
4
  page: fallback(z.number(), 1).default(1),
5
  sort: fallback(z.enum(['newest', 'oldest', 'price']), 'newest').default(
6
    'newest',
7
  ),
8
})
9

10
export const Route = createFileRoute('/shop/products/')({
11
  validateSearch: zodValidator(productSearchSchema),
12
})

1
export const Route = createRootRoute({
2
  validateSearch: zodValidator(searchSchema),
3
  search: {
4
    middlewares: [
5
      ({search, next}) => {
6
        const result = next(search)
7
        return {
8
          rootValue: search.rootValue
9
          ...result
10
        }
11
      }
12
    ]
13
  }
14
})