如何使用Vue-Router在Vue中设置查询参数而不需要重新加载组件

Question

我正在尝试使用 Vue-Router 设置查询参数而不重新加载 Vue 中的组件。但使用下面的代码会重新加载组件：

this.$router.replace({query: this.filters});

我们如何在更改查询参数时停止重新加载组件？

Answer 1

this.$router.replace({ ...this.$router.currentRoute, query: this.filters });

转到当前路径不会再次渲染当前组件

Answer 2

根据@ManUtopiK，您可以使用javascript的历史记录API来完成此操作，请在此处查看他的答案。

Answer 3

以下解决方案在 vue2 中适用于我。你可以尝试一下...

this.$router.push({name: this.$route.name, query: this.filters});