クエリパラメータのみが異なるURL間のthis.$router.push
例
下記のような例の時に、/userの画面のインスタンスが再利用されるため、
うまく再読み込みできませんでした。
理由がわからず詰まってたところ、公式ドキュメントに記載がありました。
上記「公式ドキュメント」の「パラメーター変更の検知」のところに記載があります。
index.vue
// 現在のパスが、「/user?id=1」の時に、下記のpushが行われた時
methods: {
clickAge: function (age) {
// このthis.$router.pushでは/user画面の再描画がされない
this.$router.push({ path:'/user', query: { age } })
}
}
パラメータ変更のみのthis.$router.pushの時にも再読み込みをしたい場合
上記「公式ドキュメント」の「パラメーター変更の検知」の部分に対応策が載っていますので、
ご覧ください。
参考URL
公式ドキュメント Vue Router | 動的ルートマッチング
※上記「公式ドキュメント」と同じURLです。