How I can set search params when using @reach/router

Question

How I can set search params when using @reach/router? I just used props.history.push but props.history still undefined. Here is my code when page state chage

const handleChangePage = page => {
    setPage(page)
    const query = new URLSearchParams(props.location.pathname)
    props.history.push({
       pathname: props.location.pathname,
       search: query.toString(),
    })
    //???  I want to set page for url similar to /product?page=3&limit=4
}

`navigate('/product?page=3&limit=4')` should work – Shubham Khatri May 22 '20 at 13:28 — Shubham Khatri, May 22 '20 at 13:28

score 1 · Accepted Answer · answered May 22 '20 at 13:35

With react router you must use navigate to change routes and not history

Also you would use props.location.search to get query params

const handleChangePage = page => {
    setPage(page)
    const query = new URLSearchParams(props.location.pathname)
    const path = `${props.location.pathname}?${query.toString()}
    navigate(path);
}

How I can set search params when using @reach/router

1 Answers1