我正在尝试使用react-router(v5)在按钮单击时仅更新一个查询参数键值。
const btnClickHandler = () =>{
history.push({ search: 'popup=false' });
}
我希望此代码从以下位置更新网址:
https://base-url.com/?popup=true&checked=true
至:
https://base-url.com/?popup=false&checked=true
但是,它将整个搜索替换为:
https://base-url.com/?popup=false
基本上,不是替换所有查询参数键值,而是仅替换一个?
您需要先合并查询参数,然后再进行更新。您可以使用query-string
库来简化您的工作
import qs from 'query-string';
const Component = ({ location}) => {
const btnClickHandler = () =>{
const queryParams = qs.parse(location.search);
const newQueries = { ...queryParams, popup:false};
history.push({ search: qa.stringify(newQueries) });
}
}