Question

删除参数时，它不会在地址栏中生效。我尝试按行删除URL中的参数。

delete this.$route.query[parameter_name];

见下面的网址，注意事项。

在控制台查询对象中为空，但地址栏包含所有参数。
我尝试按行删除URL中的申请人和分支参数。它只在控制台中生效，因为您可以看到查询对象为空但URL仍然存在。

delete this.$route.query['applicants'];

delete this.$route.query['branches'];

但地址栏仍然删除了所有参数。

donate#/?applicants=Female&branches=2207962

Answer 1

使用delete将删除该属性，但不会更新地址栏。您需要以编程方式指定重定向。请参阅Programmatic Navigation。

您可以使用

this.$router.push('donate')

或者

this.$router.replace('donate')

替换当前的历史记录条目（请参阅@thanksd的评论）

Answer 2

这将与$router.push或$router.replace一起使用以清除查询字符串。

清除组件生命周期挂钩中的查询字符串。

mounted() {
  this.$router.replace({ query: { '': null } });
}

清除重定向时的查询字符串。

$router.push({ path: 'url-path', query: { '': null } })
$router.replace({ path: 'url-path', query: { '': null } })

删除旧的查询字符串值并替换为新值。

$router.push({path: 'url-path', query: {'': null, lastname: 'Ever', firstname: 'Greatest'}})
$router.replace({ path: 'url-path', query: { '': null  token: 'coolToken' })

vuejs this。$ route问题与地址栏

2 个答案: