[Doc][v6] Add useSearchParams in useHistory section of v6 migration guide

[kkirsche]

In https://reactrouter.com/docs/en/v6/upgrading/v5 I would recommend adding a note in the useHistory section about search parameters. This is because users may have:

    history.replace({
      pathname: location.pathname,
      search: new URLSearchParams({
        section: value,
      }).toString(),
    });

or similar code blocks that would benefit from calling the new hook out explicitly.

[github-actions[bot]]

This issue has been automatically marked stale because we haven't received a response from the original author in a while 🙈. This automation helps keep the issue tracker clean from issues that are not actionable. Please reach out if you have more information for us or you think this issue shouldn't be closed! 🙂 If you don't do so within 7 days, this issue will be automatically closed.

[kkirsche]

I think this is worth adding still, but I can understand if you choose not to

[cseas]

I'm trying to migrate my codebase from react router v5 to v6.

We had this code in v5:

import qs from 'query-string';
...
const params = qs.parse(location.search);
...
history.replace({ search: qs.stringify(params) })

What's the v6 equivalent of this? The navigate API doesn't have any mention of search, neither does the migration guide.

[kkirsche]

I haven't used qs, but something like:

import { useSearchParams } from "react-router-dom";
...
const [searchParams, setSearchParams] = useSearchParams();
...
      setSearchParams({ tab: newValue });

or

import { useSearchParams } from "react-router-dom";
...
const [searchParams, setSearchParams] = useSearchParams();
...
      setSearchParams((prev) => {
          prev.set(namespaceKey, JSON.stringify(newSortModel));
          return prev;
      });

[thecristen]

Using search in the navigate call worked for me, so I think your v6 equivalent might be navigate({ search: qs.stringify(params) });