How to get query params from url in react.js?

@jasen 

You can get query params from the URL in React.js by using the URLSearchParams API. Here's an example of how you can do this:

First, import useEffect and useLocation from react and useParams from react-router-dom:

1
2

import React, { useEffect } from 'react';
import { useLocation, useParams } from 'react-router-dom';

Next, create a functional component where you can access the query params:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

const MyComponent = () => {
  const location = useLocation();
  const params = new URLSearchParams(location.search);

  useEffect(() => {
    const paramValue = params.get('paramName');
    console.log(paramValue);
  }, [location.search]);

  return (
    <div>
      {/* Your component content here */}
    </div>
  );
};

In this example, URLSearchParams is used to parse the query params from the URL. You can then use the get method to retrieve the value of a specific parameter. The useEffect hook is used to run the code that retrieves the query params every time the URL changes.

Remember to replace 'paramName' with the name of the query parameter you want to retrieve. You can also access multiple query params by calling params.get() for each parameter you want to retrieve.

By following these steps, you can easily get query params from the URL in your React.js application.