React-router：有没有办法使用历史推送来在此当前路径之后附加查询字符串？

Question

我当前的 URL 是 /foo，我想向其中添加一个查询字符串，即 /foo?date=2022-02-15

我的方法是location.search = queryString，它可以工作，但会导致完全重新加载。我想使用 react-router 中的历史记录 API，这样我就可以避免完全重新加载。

但是 history.push 将用 date=2022-02-15 替换整个路径 /foo（所以 URL 将是 date=2022-02-15 而不是 /foo?date=2022-02-15) 因为它不会像 location.search 那样将 ?date=2022-02-15 附加到当前路径 /foo。那么有没有一种方法可以使用 history API 来实现相同的行为？

Answer 1

可以从当前正在匹配渲染的路由的location对象中获取当前pathname

示例：

const location = useRouteMatch();
const queryString = "date=2022-02-15";

...

// as a string
history.push(`${location.pathname}?${queryString}`);

// or as an object
history.push({
  pathname: location.pathname,
  search: `?${queryString}`,
});

React-router：有没有办法使用历史推送来在此当前路径之后附加查询字符串？

React-router: is there a way to use push from history to append a query string after this current path?

html

javascript

html5-history

react-router