DEV Community

Cover image for How to use useSearchParams With React Router v6 ?
Nischal Gautam
Nischal Gautam

Posted on

How to use useSearchParams With React Router v6 ?

First Lets define Routes that will allow us to use useSearchParams in react-router v6.

<Routes>
  <Route element={<SomeComponent />} path="some-route/*" />
</Routes>
Enter fullscreen mode Exit fullscreen mode

Now inside the SomeComponent

  const [searchParams, setSearchParams] = useSearchParams({});
  setSearchParams({ hello: "world"  });
  console.log(searchParams);
Enter fullscreen mode Exit fullscreen mode

This will set https://somevalidurl.com?hello=world in the URL.

Top comments (0)