remove specific query string react-router-dom v6

Question

Hi I have an array of a query string with the same key and I wanna remove one of them:

https://example.com/something?orderby=date&orderby=price&orderby=amount

  const [searchParams, setSearchParams] = useSearchParams();
  let udpatedSearchParams = new URLSearchParams(searchParams.toString());

  const remove = (key) => {
    udpatedSearchParams.delete(key);
    setSearchParams(udpatedSearchParams.toString());
  };

remove("orderby") // => https://example.com/something?

but I wanna this:

remove("orderby","amount") // => https://example.com/something?orderby=date&orderby=price

Deniz Karadağ · Accepted Answer · 2022-07-08 14:18:45Z

1

It doesn't have the fanciest variable naming but it does the work

const remove = (key, url) => {
  let reqUrl = url.split("?");
  let paramArray = reqUrl[1].split("&");
  let result = paramArray.reduce(function (a, b) {
    console.log(b);
    if (b.split("=")[1] !== key) {
      return [...a, b];
    } else {
      return [...a];
    }
  }, []);

  return reqUrl[0] + "?" + result.join("&");
};

remove(
  "price",
  "https://example.com/something?orderby=date&orderby=price&orderby=amount"
);

output will be:

'https://example.com/something?orderby=date&orderby=amount'

edited Jul 8, 2022 at 14:18

answered Jul 8, 2022 at 13:55

Deniz Karadağ

7614 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Emma Teylor Over a year ago

Thanks! and how to set it as a query string ?

Deniz Karadağ Over a year ago

Function returns the query string as result.

Collectives™ on Stack Overflow

remove specific query string react-router-dom v6

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related