使用@reach/router 时如何设置搜索参数

Question

使用@reach/router时如何设置搜索参数？我刚刚使用 props.history.push 但 props.history 仍未定义。这是我在页面状态变化时的代码

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
}

Answer 1

对于 React 路由器，您必须使用 navigate 来更改路由，而不是 history

你也可以使用 props.location.search 得到 query params

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

使用@reach/router 时如何设置搜索参数

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

reactjs

reach-router