Revision history [back]

There are multiple ways to remove a query parameter from a URL, but the most common method used in ReactJS is to use the history object provided by the react-router-dom library.

Here's an example of how to remove a query parameter from a URL using the history object:

1. First, we need to import the useLocation and useHistory hooks from the react-router-dom library:

import { useLocation, useHistory } from 'react-router-dom';

1. Then, we can use the useLocation hook to get the current URL and its query parameters:

const location = useLocation();
const queryParams = new URLSearchParams(location.search);

1. We can then remove the query parameter we want by calling the delete method of the URLSearchParams object:

queryParams.delete('parameterName');

1. We can now update the URL without the removed query parameter by using the useHistory hook and its push method:

const history = useHistory();
history.push(`${location.pathname}?${queryParams.toString()}`);

This will update the URL without the removed query parameter and trigger a page navigation to the updated URL.