$ router.replace（）不更新瀏覽器查詢字符串

問題是查詢字符串沒有顯示在瀏覽器的URL欄中。

代碼更新查詢字符串以跟蹤產品配置。

有兩種方法 - 第一種選擇模型，第二種爲模型設置選項。下面的代碼（用於查詢字符串的值是佔位符現在）：

方法：

chooseModel (option) { 
    this.$router.replace({ 
    path: this.$route.path, 
    query: {m: 'model'}, 
    }) 
}, 
choose (option) { 
    if (!this.selectedModel) return 
    let opt = {} 
    opt[option] = option 
    this.$router.push({   // I've tried push and replace 
    path: this.$route.path, 
    query: Object.assign(this.$route.query, opt), 
    }) 
},

式計算：

selectedModel() { 
    return this.$route.query.m 
},

當chooseModel調用查詢字符串，瀏覽器顯示顯示向上因爲它應該：http://localhost:8080/custom/?m=model。但是，調用choose時，瀏覽器顯示的查詢字符串保持不變。

FWIW，我更改了chooseModel中的代碼以設置多個查詢字符串值，並且它們都顯示出來。顯然它試圖修改導致問題的那個值。

使用調試器我可以看到$route.query是正確的 - 它反映了我對查詢所做的更改。

我看到了Firefox和Chrome的相同行爲，所以它顯然不是瀏覽器特定的。

我需要做什麼才能讓瀏覽器顯示更新後的查詢字符串？

來源

2017-04-15 bmacnaughton

這是我的錯誤，但奇怪的行爲仍然。

由於路線是不可變的（https://router.vuejs.org/en/api/route-object.html）Object.assign()無法對其進行修改。奇怪的是，在我試圖修改查詢字符串之後，新的路由對象顯示了我試圖設置的值，即使瀏覽器沒有顯示它們。

解決方法是簡單的 - 不要試圖修改路由對象：

query: Object.assign({}, this.$route.query, opt)

來源

2017-04-16 20:24:03 bmacnaughton

$ router.replace（）不更新瀏覽器查詢字符串

回答

相關問題