Get query params of the current URL in Gatsby
npm install gatsby-query-paramsbash
npm add gatsby-query-params
`
Function Signature
1. getSearchParams - Return query parameters as an object.
`jsx
import { getSearchParams } from "gatsby-query-params";
const searchParams = getSearchParams();
`
2. useQueryParam - Return query parameter for a specific key. If it doesn't exist, returns a set default value ( default null ).
`jsx
import { useQueryParam } from "gatsby-query-params";
const value = useQueryParam(key, defaultValue);
`
Usage
`jsx
import React, {useState, useEffect} from 'react'
import { useQueryParam, getSearchParams } from "gatsby-query-params";
function App() {
const name = useQueryParam("name", "Akash"); // key, defaultValue
console.log(name); // log query param
console.log(getSearchParams()); // Log all parameters
return (
Hello
)
}
export default App
`
Example
1. Run npm start on the root folder.
2. cd example
3. npm start`