VUE路由器:更新查询时，this.$ router.push不起作用

问题描述

我想更新有关url的查询.但是，$ router.push不会更新url.每个呼叫的 disp 值是不同的.为什么?

I want to update query on url. But, $router.push does not updating url. disp is different value for each call. Why?

handle: function(disp) {
    let route = Object.assign({}, this.$route);
    route.query.disp = disp;
    this.$router.push(route);
},

版本.

"vue": "^2.5.17",
"vue-router": "^3.0.1",

路由(console.log)

route (console.log)

推荐答案

您不应尝试推送到route对象.相反，您应该使用以下选项之一:

You shouldn't try to push to the route object. Instead you should use one of these:

// literal string path
router.push('home')

// object
router.push({ path: 'home' })

// named route
router.push({ name: 'user', params: { userId: 123 }})

// with query, resulting in /register?plan=private
router.push({ path: 'register', query: { plan: 'private' }})

在您的情况下:

this.$router.push({path: this.$route.path, query: {disp: disp}})

这篇关于VUE路由器:更新查询时，this.$ router.push不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！