react路由器v6扩展搜索参数而不是替换它
react路由器v6扩展搜索参数而不是替换它
提问于 2021-12-13 04:19:00
目前，执行setSearchParams(/* an object */)将取代现有的搜索参数。如果我想扩展搜索参数，而不是替换它们，例如添加一个新的param。实现这一目标的最优雅的方法是什么？
我知道我可以直接修改searchParams，然后做一些类似setSearchParams(newSearchParamsToObject)的事情。然而，因为searchParams不是一个对象而是一个URLSearchParams。代码又长又丑。
编辑:既然有人出现了，就不明白我贴了什么
目前，如果我们这样做：
const [searchParams, setSearchParams] = useSearchParams({ a: 1 });
setSearchParams({ b: 2 });它将用searchParams取代?b=2。
我想要实现的是将b=2添加到现有的搜索参数中，即最终的搜索参数应该是?a=1&b=2。
Stack Overflow用户
发布于 2021-12-13 05:48:19
我认为设置要添加的搜索param值非常简单。
const [searchParams, setSearchParams] = useSearchParams();
...
searchParams.set(newParamKey, newParamValue);
setSearchParams(searchParams);
const [searchParams, setSearchParams] = useSearchParams();
const clickHandler = () => {
searchParams.set("b", 2);
setSearchParams(searchParams);
};
...
<button type="button" onClick={clickHandler}>
Add "b=2" param
</button>似乎也有效：
setSearchParams([...searchParams.entries(), ['b', 2]]);
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70329879
复制相关文章
相似问题
腾讯云开发者
