How i set and get multiple query parameteres for object in react js(dynamic)

Question

This is my data object:

const data = {
 langauge_in: ["EN"],
 resource_type_in: ["VIDEOS"]
};

How i set this in query parameters of url like this:

localhost:3000/resource/?language_in[]=EN&resource_type_in[]=VIDEOS

Note: The values of filter can be multiple and it needs to change when i update the filter.

This is the code that i alredy tried:

 useEffect(() => {
  let params = {};
   new URLSearchParams(data)
   .forEach((value, key) => { params = { ...params, [key]: value }; });
   console.log('>>> params', params);
   history.push({ search: params.toString() });
 }, [history, data]);

Thank you:)

Answer 1

You have to access the url parameter and pass that as the useeffect dependency. so any time the parameters change, useeffect runs to get the new values. try something along these lines:

  const urlParams = new URLSearchParams(window.location.search);
  const langauge = urlParams.get("langauge_in");
  const resource = urlParams.get("resource_type_in");

  useEffect(()=>{

  console.log(language)
  console.log(resource)

  }, [language, resource])