如何在URL查询参数中设置数组

Question

我有多个复选框输入。如果选中，我想这样设置查询参数:

主题[]= 1,主题[]= 2,…

请帮我解决这个问题

这是我的唯一参数代码:

const addQueryParam = (name, value) => {
const urlParam = new URL(window.location.href);
if (!value) {
urlParam.searchParams.delete(name);
} else {
urlParam.searchParams.set(name, value);
}
window.history.pushState({ path: urlParam.href }, "", urlParam.href);
};

Answer 1

您可以像这样构建查询参数:

// Values I want to pass by queryParams
const params = { name: 'Jhons', multiCheckbox: [1, 2, 3], ...otherValues};

然后遍历该对象，构建将传递给查询参数的字符串

let queryParams = ''; 
Object.keys(params).map(key => {
if (Array.isArray(params[key])) {
queryParams += params[key].map((value) => `${key}[]=${value}`).join('&')
}
queryParams += `${key}=${params[key]}&`
})

打印queryParams得到如下内容:

'name=Jhons&multiCheckbox[]=1&multiCheckbox[]=2&multiCheckbox[]=3'