如何在反应

Question

我有一个应用程序，它接受搜索字符串并在一个路径中返回结果：hosts.abc.com:3000。网址没有变化。

我希望搜索反映在网址中，以便我可以分享链接，用户不必在表单字段中进行所有选择。

eg: hosts.abc.com:3000/?type=all&query=coins

是否可以使用react-router进行此操作？

Answer 1

要构建此类查询，您可以使用本机浏览器URLSearchParams：

const searchParams = new URLSearchParams();
searchParams.append("type", "all");
searchParams.append("query", "coins");
searchParams.toString(); // "type=all&query=coins"

// update browser url
this.props.history.push('/current/route/?' + searchParams.toString());
// or
this.props.history.push({
  pathname: '/current/route/',
  search: searchParams.toString()
})

但是如果你想要更好的支持query-string是一个类似的选择。