我在路由到带有查询参数的路由时遇到了问题,我的函数如下:
goToLink(link) {
this.router.navigate([`${link.split('?')[0]}`, { queryParams: this.sortParams(link)}]);
}
并且这个函数
sortParams(link) {
let queryParams = url.split('?')[1];
let params = queryParams.split('&');
let pair = null;
let data = {};
params.forEach((d) => {
pair = d.split('=');
data[`${pair[0]}`] = pair[1];
});
return data;
}
基本上正在发生的事情是我有一个名为goToLink()
的函数,它需要传入一个带有查询参数的url字符串,如下所示:
https://website.com/page?id=37&username=jimmy
上面只是一个示例,实际上看起来不是这样的,但是这是一个带有查询参数的链接字符串。现在,我将从该字符串中删除参数并将其存储在sortParams()
函数中的数据对象中,因此当我将上述字符串传递到函数中时,我将获得一个类似于以下内容的对象
{id: 37, username: 'jimmy'}
现在,这就是我要传递到router.navigate
的queryParams:
部分的内容。
当返回该对象时,该函数应该像这样
this.router.navigate([`${link.split('?')[0]}`, { queryParams: {id: 37, username: 'jimmy'}}]);
所以我成功地路由到了所需的路由,但查询参数看起来像这样..
/page;queryParams=%5Bobject%20Object%5D
我做错了什么吗?
任何帮助都将不胜感激!
编辑
如果我只是将函数更改为以下内容
this.router.navigate([`${link.split('?')[0]}`, { queryParams: {id: 37, username: 'jimmy'}}]);
我得到了相同的网址 /page;queryParams=%5Bobject%20Object%5D