解决给Vue Router 添加动态Query无法响应问题
错误代码如下:
// 往url中添加参数
addUrlQuery(key, value) {
let newQuery = this.$route.query
newQuery[key] = value
this.$router.push({query: newQuery})
}
一般往url栏里边添加参数,当参数为多个时,为了方便,会直接获取到当前url栏里边原有的query参数,然后在其中添加新的参数即可。
但此时往往会出现,添加参数但是url里边的参数没有任何变化。
所以需要重新创建一个对象来添加:
addUrlQuery(key, value) {
let newQuery = {...this.$route.query}
newQuery[key] = value
this.$router.push({query: newQuery})
}
当往url添加的query对象是一个新的对象时,即可成功