TanStackT
TanStack•15mo ago•
1 reply
conventional-black

useSearch with validateSearch in _layout

I have the following routing structure
- post
   |- $postId
        |- _layout.tsx
        |- _layout
             |- index.tsx


in _layout.tsx I use <Outlet/> to render what index.tsx is rendering.
And I also do search validation for the foorBar search param.

  validateSearch: ({
    fooBar,
  }: {
    fooBar: string;
  })=> {
    if (!fooBar) {
      throw new Error('fooBar is required');
    }
    return { fooBar };
  },


Then inside my component, I do

const { fooBar } = useSearch({ from: '/post/$postId/' });


And I get Property 'fooBar' does not exist on type '{}'.

However, if I do the following, it's inferred correctly.

const { fooBar } = useSearch({ from: '/post/$postId/_layout' });


Do I make a mistake here, or is this how it should be? Because I can access the path params without any issues with /post/$postId when using useParams
Was this page helpful?