Fetch specific paramater from URL using react-CodePudding

I have a URL like this that is created by external parties.

https://localhost:3001/succesful?code=3434443A&scope=xyz

I need to find the code and scope from the URL.

I tried to do it like this but not working

    const { code, scope} = useParams();

Could someone help me?

CodePudding user response：

Make sure you are using the react-router-dom library for the below solution.

import {    useSearchParams } from "react-router-dom";

You can refer to the below piece of code to fetch the information from the URL and use it in a particular component.

const [queryParameters] = useSearchParams()

and you can fetch code and scope like:

{queryParameters.get("code")}
{queryParameters.get("scope")}

CodePudding user response：

import {useSearchParams} from "react-router-dom"

function Home() {
  const [queryParameters] = useSearchParams()

  return (
    <div>
      <p>Type: {queryParameters.get("code")}</p>
      <p>Name: {queryParameters.get("scope")}</p>
    </div>
  )
}